navController.setRoot(Page) does not work inside a popover

[pdrosos]

Short description of the problem:

When trying to navigate to a new page via an anchor click and call navController.setRoot(Page) inside a popover, the new page is not displayed. If navController.push(Page) is used instead, the page is displayed. Tested with Firefox, Chrome and Android 5.0.

What behavior are you expecting?

I expect the page, set via navController.setRoot inside the popover component to show up.

Steps to reproduce:

1. Create a new project, based on the tabs template: ionic start ProjectName --v2
2. Add a button, which opens a popover on the home page's header.
3. Inside the popover page, add an anchor, which on click must navigate to other page: this.navController.setRoot(Page);
4. When this anchor is clicked, the new page is not displayed.

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)
A repository, which demonstrates the problem can be found here.

Which Ionic Version? 1.x or 2.x
2.0.0-rc.0, 2.0.0-rc.1

Run ionic info from terminal/cmd prompt: (paste output below)
Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.0
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
OS: Distributor ID: LinuxMint Description: Linux Mint 18 Sarah
Node Version: v6.7.

[pdrosos]

@jgw96 @danbucholtz is there a chance this one to be fixed in the next RC release? It used to work in beta11 and after the update to rc0 it's no longer working. I need it in my app, because I have a logout button inside a popover, which must take user to login page via navController.setRoot(LoginPage); and now the LoginPage is not displayed anymore.

Thanks!

[pufanalexandru]

I have the same problem, any news about this?

[daveshirman]

Same problem within a modal window too.

[Geoffrey-D]

same problem with a popover. The new page is loaded (when I check the DOM I can see it) but the 'old' page is still displayed. It seems that the page from which the popover has been invoked is not destroyed, as you can see here :

The "app-root" is the old page (that was hosting the popover and that should not been displayed anymore) and the "ion-page" is the page that should be displayed.

It worked on beta-11 but not on RC-0

[pdrosos]

@danbucholtz @brandyscarney could you please let us know if this could be fixed, or we need to change the UI of our apps? It's important to know if I must move the button, which opens a new page via setRoot outside the popover.

[devarg]

@pdrosos You may workaround it with events api. Make your app-component subscribe to a event you may call "app:logout" and set the root page to the login from there. Inject Event from constructor so you can publish the "app:logout" event from your popover.

[jgw96]

Hello @pdrosos and @devarg, sorry for the delay on this! So the correct method to use to setRoot on the "base" page from a popover is this this.app.getRootNav().setRoot(SupportPage);. This will get the NavController of the base page (not the popover) and run a setRoot on that NavController.

[bgondy]

For beginners like me who didn't understand where this.app comes from (in the previous comment), you need to inject App in the popover's constructor (constructor(protected app: App){} and import {App} from "ionic-angular";). Hope it helps!

[daveshirman]

@jgw96 @manucorporat I still get a white screen of death if I try to redirect using setRoot from anywhere other than a root level page.

Bottom line is this issue should not be closed. It is still present. See gif below when redirecting from a 2nd level page in:

My app receives a logout event in the app.component class and does exactly as stated above:

this.app.getRootNav().setRoot(LoginPage)

Yet, as you can see, I get a white screen of death.
When i switch tasks using the system button, the page is rendered again.

[danielehrhardt]

Same here

[Micheloss]

Same here, Does someone has any kind of work around?

[rafaret12]

hello ... I am in urgent need of the version NavController_Release_v6 who could send me doing a favor email: [email protected] since thanks

[iamisti]

have the same white dead screen... and what is more irritating is that there is no way of debugging when running natively

[vagnersabadi]

One solution I found was to close the popover and then call setRoot
close(){
this.viewCtrl.dismiss();
this.navCtrl.setRoot(IntroPage);
}

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.