Changing the tabs after login


#1

Hi all,

I’m pretty new here, and with ionic 2 (and angular2) as well. I search half the internet but couldn’t find a solution that fit my problem.

I am building an app where you can log in (and out), and in both states you should able to use the tabs, only they are different.

When you are logged in you should see search and logout, and otherwise it should be login and help.
I tried something but it doesn’t work exactly as i hoped/expecting.

There are 2 ‘tabs’ pages, 1 for logged in users and 1 for the others, after logging in i try to load other tab structure by doing this: self.navCtrl.setRoot(TabsLoggedinPage);

The result is the page from the first tab in TabsLoggedinPage is loading correctly, but the tabs itself aren’t changing (so they still show login/help).

In the app.components.ts i have rootPage = TabsLoggedoutPage;

Anyway that can point me in the right direction? I really like the looks and feeling of ionic 2, definitely gonna spend more time on learning it!


#2

I have a virtually identical setup. My local storage provider exposes an Observable<boolean> representing the login state. Inside the platform.ready() block of the app’s constructor, I do this:

sink.authenticationNotifier().subscribe((authed) => {
  if (authed) {
    this.rootPage = TabsPage;
  } else {
    this.rootPage = UnauthedTabsPage;
  }
});

#3

Thanks for your advise/code, it works right now, with an Observable!