Ionic-framework: Back button not working when opening page within a popover

[basvdijk]

Short description of the problem:

When I create a popover with some ion-items opening another page, the back button is not working anymore when I navigate to this new page.

What behavior are you expecting?

I expect the back button to work as a normal nav.push would do. I press the back button and go back to the page the popup showed up.

Steps to reproduce:

1. Create a popup window with ion-items which navigate to a new page

Which Ionic Version? 1.x or 2.x
Ionic2 Beta 8

[jgw96]

Hello, thanks for opening an issue with us! When you say back button do you mean the hardware back button or the back button in the navbar ? Thanks for using Ionic!

[basvdijk]

Hi I haven't actually tested the hardware button, but I meant the arrow in the navbar.

[jgw96]

@basvdijk Ahh ok. Would you mind making a plunker that demonstrates this issue? Thanks (:

[basvdijk]

Hi I've created a Plunkr at http://plnkr.co/K22pyPSm5JQrrqWKdsLp here it works as it supposed to be. I'll look into this next week to what is different from my app.

[jgw96]

@basvdijk Awesome, looking forward to what you find!

[basvdijk]

My problem kept running through my mind so I decided to start commenting everything and build it up again. It turned out the problem was this.viewCtrl.dismiss(); on line 24 in popup.ts in my Plunkr. I want the popup to close when someone tapped an action in the popup. It turned out that I shouldn't execute the dismiss before the nav.push.

Question is how do I autoclose the popover when I navigate to another view. Moving this.viewCtrl.dismiss(); doesn't work.

Update: got it nav.push returns a promise.

[jgw96]

Hello @basvdijk looks like you found the solution 😃. In Ionic 2 our whole navigation system is completely async, so nav.pop, nav.push etc all return promises that you can hook in to. As it looks like you found the solution for this issue I will be closing this issue. Thanks for using Ionic!

[richardmarais]

I am having a similar issue, but when navigating to another page. Please see: http://stackoverflow.com/questions/39017396/navigating-back-to-root-menu-toggle-button-broken

[zakton5]

Just to add some clarification. I ran into this issue and the solution was this:

this.navCtrl.push(PageType).then(() => {
    this.viewCtrl.dismiss();
});

Notice that the next page is being pushed first, and then the popover is dismissed once the promise is resolved. Doing it the other way around will result in this issue (the back button being hidden).

[hadijahangiri]

hi. use here code

 import { App } from 'ionic-angular';

constuctor(public app: App) {};

pushSignupPage() {
    this.viewCtrl.dismiss().then(() => {
      this.app.getRootNav().push(SignupPage);
    });
  }

this is work for me, good luck

[awicz]

@hadijahangiri Thanks, this is the only solution that has worked for me since upgrading to Ionic 3

[ghost]

awesome thanks @basvdijk

[syarifuddinahmads]

@hadijahangiri , thanks very much , its work for me but slow response to navigate to other page i think to modify and this my improve

this.viewCtrl.dismiss();
this.app.getRootNav().push(SettingsPage);

and work

[ionitron-bot[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.