I have three tabs as follows:
<ion-tabs>
<ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab>
<ion-tab [root]="tab2Root" (ionSelect)="goToPreviousPage()" tabTitle="Back" tabIcon="arrow-back"></ion-tab>
<ion-tab [root]="tab3Root" (ionSelect)="goToNextPage()" tabTitle="Next" tabIcon="arrow-forward"></ion-tab>
</ion-tabs>
So tab 1 loads the main content and the other two tabs are for navigating the app. Here is the tabs component:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { HomePage } from '../home/home';
@Component({
templateUrl: 'tabs.html'
})
export class TabsPage {
tab1Root: any = HomePage;
tab2Root: any;
tab3Root: any;
navCtrl;
constructor(navCtrl: NavController) {
this.navCtrl = navCtrl;
}
goToPreviousPage(){
// Need logic to navigate back in history for Tab 1
}
goToNextPage(){
//Logic to navigate forward in Tab 1 content
}
}
Is there a way to get the NavController for Tab1 so as to navigate it’s history, or is there a way to get component for tab 1, so as to call methods defined within it?