ionic-framework: Navigating via url to a page where ionViewCanEnter() fails leads to a white screen

Ionic version: (check one with “x”)

[ ] 1.x [ ] 2.x [x] 3.x

I’m submitting a … (check one with “x”)

[x] bug report [ ] feature request [ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:

With the new lazy loading structure and the Deeplinking method, using NavGuards becomes even more important. But when I use IonViewCanEnter(), I can only return false or true and not set the new page to navigate to, if I load the page directly by URL, so the only thing I will be seeing is a blank screen. I have already tried to pass defaultHistory via @IonicPage(), but that is not working as well

Expected behavior:

I should have to able to set the page I would want to navigate to in case the ionViewCanEnter() fails when typing in the url.

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Cordova CLI: Not installed Ionic Framework Version: 3.1.0 Ionic CLI Version: 2.2.3 Ionic App Lib Version: 2.2.1 Ionic App Scripts Version: 1.3.5 ios-deploy version: 1.9.1 ios-sim version: 5.0.13 OS: macOS Sierra Node Version: v6.10.2 Xcode version: Xcode 8.3.1 Build version 8E1000a

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Comments: 15 (4 by maintainers)

Most upvoted comments

@rayhaanq I use something like this:

ionViewCanEnter(): boolean {
  if (isAuthorized) {
    return true;
  } else {
    setTimeout(() => this.navCtrl.setRoot('LoginPage'), 0);
    // displayError();
    return false;
  }
}

You can also move this code to a service if most of your nav guards have the same behaviour (e.g., checking if the user is logged in). All you need to do then is move the above code in a method of your service, and then in your component add the following:

ionViewCanEnter(): boolean {
  return this.authService.securePageCanEnter();
}

Another workaround is using setTimeout

setTimeout(function() {
  navCtrl.setRoot('login');
}, 0);

Hi, can somebody explain how the setTimeout workaround works? 🤔

Thanks in advance