Change TabRoot Ion Cord Dynamically at Run Time

Question

I created the Ionic Tabs app.

Tabs.html:

<ion-tabs>
  <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="md-home"></ion-tab>
  <ion-tab [root]="tab2Root" tabTitle="About" tabIcon="md-information-circle"></ion-tab>
  <ion-tab [root]="tab3Root" tabTitle="My Account" tabIcon="md-log-in"></ion-tab>
</ion-tabs>

and tabs.ts

@Component({
  templateUrl: 'tabs.html'
})
export class TabsPage {

  tab1Root = HomePage;
  tab2Root = AboutPage;
  tab3Root = LoginPage;

  constructor()
  {}

}

What I want to do is when I am on tab3Root (LoginPage) and I am logged in, I want to change it to LoggedinPage. Maintaining other tabs, functioning and normal.

Is it possible? If so, how please?

thank

Information added: check / edit this link which contains my code as an example stackblitz.com/edit/ionic-yff2sx

Answer 1

Just call up another page from this tab using the setRoot method. call the method below from the login page.

this.navCtrl.setRoot(this.loggedInPage);

Please refer to this working demo.

home.ts log In loggedIn . " " , "" .

Answer 2

, . HTTP-. ..

Answer 3

prithivi Raj , .

inOrder, , -

 this.navCtrl.parrent.select(0);

Consider that you are in tab3, and after entering the system you want to go to tab1 / tab2, simply enter the code in the above code parameter, such as this.navCtrl.parrent.select(0);/ this.navCtrl.parrent.select(1),. it will lead you to this tab if you use `this.navCtrl.setRoot (" this. loggedInPage "); it will not highlight tabs that will lead to user confusion in which the tab is now active.