Custom button in <ion-tabs>

Ionic Framework ionic-v3
1

Hey everyone,

I was wondering if there was a way to get a custom button inside of the <ion-tabs> component. Instead of having all of the tabs navigate to another screen, I’d like one of them to be able to open a modal like this:

<ion-tabs [selectedIndex]="mySelectedIndex" class="custom-tabs-bg">
  <ion-tab tabTitle="Discover" [root]="tab1Root" tabIcon="ios-search"></ion-tab>
  <button (tap)="openModal()">Open a modal</button>
  <ion-tab tabTitle="Messages" [root]="tab3Root" tabIcon="ios-chatbubbles-outline" tabBadgeStyle="danger" [tabBadge]="getMessageNotifications()"></ion-tab>
</ion-tabs>

Is it possible to do this in Ionic 3?

2

Did you try using ion-tab as directive on button, like
<button ion-tab (tap)=“openModal()”>Open a modal

3

Yeah I tried that and Ionic didn’t actually even show anything about it in the DOM, like it doesn’t even exist :confused:

4

Hey there! Any update on it? Was anyone able to figuere this out?