Ionic 3 app is not redirecting to pages when I redirected it from storage.get('session') function

Question

I have redirected my app from app.component.ts by setting rootpage as follow

rootPage:any=HomePage;

Later when I implemented login functionality I decided to redirect page as follow

rootPage:any;//=HomePage;

  constructor(platform: Platform, 
    statusBar: StatusBar, 
    splashScreen: SplashScreen,
    private storage: Storage,
    private changeDetectorRef: ChangeDetectorRef) {

      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();

        // Check session and redirect
        storage.get('session').then((val) => {
          if(val){
            this.rootPage=HomePage;
          }else{
            this.rootPage=LoginPage;
          }
        });
      });
  }

But my page is not redirecting .

What I tried -

1. Page is redirecting when I am using this.changeDetectorRef.detectChanges() after setting rootpage, but my map in homepage is not loading when I am redirecting this way.

Is there any better solution to this problem?

score 0 · Answer 1 · answered Aug 03 '17 at 14:14

0

The problem probably is that you assign the page to rootPage inside a promise. Because it is an async operation, the component renders before it is a assigned a root page. To fix it, you can simply use navCtrl.setRoot instead and wait to hide the splashscreen.

ngOnInit() {
  platform.ready().then(() => {
    // Check session and redirect
    storage.get('session').then((val) => {
      statusBar.styleDefault();
      splashScreen.hide();

      if (val) {
        this.navCtrl.setRoot(HomePage);
      } else {
        this.navCtrl.setRoot(LoginPage);
      }
    });
  });
}

Since you're not initializing root page anymore, I would also recommend doing this in ngOnInit instead of the constructor. It wasn't the cause of your problem, but it is recommended to do so.

answered Aug 03 '17 at 14:14

emroussel

1,077
11
19

When I try to do this I got following error - Error: No provider for NavController! – Dijish U.K Aug 04 '17 at 04:37
This is fixed when I redirected user from ngOnInit() – Dijish U.K Aug 04 '17 at 05:02
The error is because you didn't initialize `NavController` in your constructor. Glad you figured it out though – emroussel Aug 04 '17 at 14:20

score 0 · Answer 2 · answered Aug 04 '17 at 05:05

Everything worked fine when I redirected user from ngOnInit() as follow

ngOnInit() {
 // Check session and redirect
 this.storage.get('session').then((val) => {

   if(val){
     this.rootPage=HomePage;
   }else{
     this.rootPage=LoginPage;
   }

 });
}

Ionic 3 app is not redirecting to pages when I redirected it from storage.get('session') function

2 Answers2