Supertabs dynamic ion-title change

Ionic Framework ionic-v3
1

So I’m using supertabs for the nice sliding navigation it provides. But the problem I encountered is that I can’t use ionSelect to change the ion-title of the navbar whenever I switch tabs. The one I found on stackoverflow was for ion-tabs

Read all the documention on supertabs found on https://github.com/zyra/ionic2-super-tabs but it never mentions anything similar to ionSelect. Does anyone have any fix for this?

here’s my code that doesn’t work:

<ion-header>
<ion-navbar color="dark">
    <button ion-button menuToggle>
        <ion-icon name="menu"></ion-icon>
    </button>

  <ion-title>{{title}}</ion-title>
</ion-navbar>

<super-tabs toolbarBackground="dark" toolbarColor="main" tabsPlacement="bottom" indicatorColor="main" 
    [config]="{ sideMenu: 'left' }">
    <super-tab [root]="tab1Root" icon="icon-ai-announce" (ionSelect)="this.title ='Home'"></super-tab>
    <super-tab [root]="tab2Root" icon="icon-ai-rules" (ionSelect)="this.title ='Rules'"></super-tab>
    <super-tab [root]="tab3Root" icon="icon-ai-prison-visit" (ionSelect)="this.title ='Visit'"></super-tab>
    <super-tab [root]="tab4Root" icon="icon-ai-comments" (ionSelect)="this.title ='Comment'"></super-tab>
</super-tabs>
2

Does it support ionChange?

tabs.page.html:

<ion-tabs #tabs selectedIndex="2" (ionChange)="onIonChanged($event)">
  <ion-tab [root]="tab0Root" tabUrlPath="activity-tab" tabIcon="fa-fal-list"></ion-tab>
  <ion-tab [root]="tab1Root" tabUrlPath="location-tab" tabIcon="fa-fal-map-marker"></ion-tab>
  <ion-tab [root]="tab2Root" tabUrlPath="search-tab" tabIcon="fa-fal-street-view"></ion-tab>
  <ion-tab [root]="tab3Root" tabUrlPath="person-tab" tabIcon="fa-fal-user"></ion-tab>
  <ion-tab [root]="tab4Root" tabUrlPath="notifications-tab" tabIcon="fa-fal-bell"></ion-tab>
</ion-tabs>

tabs.page.html:

  public onIonChanged($event) {

   this.logger.info('TabsPage $event.index: ' + $event.index);

    ...

  }
3

It doesn’t support ionChange but you can use tabSelect for the same effect.

<ion-tabs #tabs selectedIndex="2" (tabSelect)="onIonChanged($event)">