ionic2 Using Tabs Change tab with selectedIndex
Example
Instead of getting a reference to the DOM you can simply change the index of the tab using the selectedIndex attribute on the ion-tabs
HTML:
<ion-tabs [selectedIndex]="tabIndex" class="tabs-icon-text" primary >
<ion-tab tabIcon="list-box" [root]="tabOne"></ion-tab>
<ion-tab tabIcon="contacts" [root]="tabTwo"></ion-tab>
<ion-tab tabIcon="chatboxes" [tabBadge]="messagesReceived" [root]="tabFive"></ion-tab>
</ion-tabs>
TS:
import { Events} from "ionic-angular";
export class tabs {
public tabIndex: number;
constructor(e: Events) {
tabs.mySelectedIndex = navParams.data.tabIndex || 0;
e.subscribe("tab:change", (newIndex) => this.tabIndex = newIndex);
}
}
If you want to change it from some other controller service you can send an event:
e.publish("tab:change",2);
