constructor(platform: Platform) {
platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
StatusBar.styleDefault();
Splashscreen.hide();
});
}
}
app.html
Contains a ion-nav with [root]=“rootPage”
“Edit2”
I tried the way you suggested, but I got the same result, it directs to LoginPage, but the tabs continue to be displayed.
I tested the hide-tabs but it did not work.
I could not use the "this.nav.rootNav.setRoot (LoginPage);"
Can not use the “rootNav” property.
I tried this way:
Public navCtrl: NavController;
This.navCtrl.rootNav.setRoot (LoginPage);
Ionic Tabs have a strange navigation stack (it’s not so strange when you think why). The <ion-tabs> instance is pushed to the root nav, and each <ion-tab> has its own NavController. This is so you can push as deep as you need to per tab, and simply switch to another tab without screwing up the other tab’s navigation stack.
Essentially what you want to do is this on one of your pages:
logout() {
this.app.getRootNav().pop();
}
The <ion-tabs> is pushed to the root navigation stack, and each tab’s individual navigation stack is a child to this, so is not part of the root. Make sense?
Not to me. I want each element of my app to be independent, with clearly defined boundaries for interaction. Having arbitrary pages mess with the app component’s nav stack breaks that contract, so I consider it flawed design.
Unfortunately, I cannot answer for the design decisions. As for the alternative solution. I agree - I suppose it depends on how you want to handle your navigation stack. I tend to avoid interacting with the root page unless I am initialising the app, since you don’t get the advantages built into the NavController.