[SOLVED] How can I trigger a custom function in Ionic 2 tabs?


I’m trying to setup a custom page that instead of opening a new context on the application will be pushed on the navigation stack, so the user can return to where he/she was before opening the so called CameraPage like the following snippet on file tabs.html:

 <ion-tab [root]="tab1Root" tabIcon="ios-paper"></ion-tab>
 <ion-tab [root]="tab2Root" tabIcon="ios-calendar"></ion-tab>
 <ion-tab (click)="openCamera()" tabIcon="custom-icon-plus"></ion-tab>
 <ion-tab [root]="tab4Root" tabIcon="ios-trophy"></ion-tab>
 <ion-tab [root]="tab5Root" tabIcon="ios-people"></ion-tab>

And on the tabs.ts file I’m trying to receive this function in order to push the page on the navigation pile without just creating a new context, it’s really important that the user returns to the spot he/she was before opening this particular page. Like the following snippet:

public openCamera() {
 this.navCtrl.push(CameraPage, {});

Unfortunately, the (click) event doesn’t get triggered when I tap on it, I’ve already tried creating a fake button or div that will wrap the <ion-tab> element, but it gets ignored and doesn’t appear on the built page… this is really frustrating, is there a way to trigger custom actions on the bottom navigation bar in Ionic 2?

Thanks in advance,

EDIT: I’m so sorry, I’ve found the solution the minute after I posted this, I just had to change the (click) for the (ionSelect) Output :smiley:


(ionSelect) is only triggered when we move from a different tab. What if we want to execute a function if someone double taps of the active tab? How do we handle that?