How to set rootPage conditionally in Ionic3

Question

I am trying to set a tutorial page for the first timers in the app and login page for others. I am setting key value in localstorage if user has been gone through the tutorial page.

export class MyApp {
rootPage: any = LoginPage;

constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
    platform.ready().then(() => {
        statusBar.styleDefault();
        if(!localStorage.getItem( 'tutorial' )) {
            this.rootPage = TutorialPage;
        }
        splashScreen.hide();
    });
  }
}

Above code is working fine but there is a delay in setting the tutorial page and Login page is viewing first then Tutorial page is coming up. I want to know that am I doing this in the right way or I am missing something?

Remove `rootPage: any = LoginPage;` use only `rootPage: any;` and put `else` block in `constructor`. — hrdkisback, Sep 25 '17 at 05:38

score 3 · Accepted Answer · answered Sep 25 '17 at 06:12

please use following code

export class MyApp {
rootPage: any;

constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
    platform.ready().then(() => {
        statusBar.styleDefault();
        if(!localStorage.getItem( 'tutorial' )) {
            this.rootPage = TutorialPage; // user can user this.nav.setRoot(TutorialPage);
        }else{
            this.rootPage = LoginPage; // user can user this.nav.setRoot(LoginPage);
        }
        splashScreen.hide();
    });
  }
}

i hope its work for you.

How to set rootPage conditionally in Ionic3

1 Answers1