Ionic-framework: Android Back Button closes ionic 3 Web App

Created on 22 Jun 2017  路  3Comments  路  Source: ionic-team/ionic-framework

Ionic version: (check one with "x")
[ ] 1.x (For Ionic 1.x issues, please use https://github.com/ionic-team/ionic-v1)
[ ] 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:

When switching page with navCtrl.push(page) and then using browser or android's back button, browser goes back to last website visited.

Expected behavior:

It should go back to the last page visited (e.g. the page before navCtrl.push(page) )

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

global packages:                                                                             

    @ionic/cli-utils : 1.3.0                                                                 
    Ionic CLI        : 3.3.0                                                                 

local packages:                                                                              

    @ionic/app-scripts              : 1.3.7                                                  
    @ionic/cli-plugin-ionic-angular : 1.3.0                                                  
    Ionic Framework                 : ionic-angular 3.3.0                                    

System:                                                                                      

    Node       : v6.10.2                                                                     
    OS         : Linux 4.4                                                                   
    Xcode      : not installed                                                               
    ios-deploy : not installed                                                               
    ios-sim    : not installed                                                               

Most helpful comment

Back button should definitely have a rework, perhaps a stack so both user and framework can have actions together. I'll look into it.

For now, you can do:

this.platform.ready().then(() => {
  this.platform.registerBackButtonAction(() => {
    if (this.nav.canGoBack())
      this.nav.pop().then(() => {}, () => {}); // If called very fast in a row, pop will reject because no pages
  }, 500);
});

Edit:
seems like the default is:

    if (this._menuCtrl && this._menuCtrl.isOpen()) {
      return this._menuCtrl.close();
    }

    const navPromise = this.navPop(); // cool method to pop from the active navigation
    if (!navPromise) {
      // no views to go back to
      // let's exit the app
      if (this._config.getBoolean('navExitApp', true)) {
        console.debug('app, goBack exitApp');
        this._plt.exitApp();
      }
    }
    return navPromise;

All 3 comments

Back button should definitely have a rework, perhaps a stack so both user and framework can have actions together. I'll look into it.

For now, you can do:

this.platform.ready().then(() => {
  this.platform.registerBackButtonAction(() => {
    if (this.nav.canGoBack())
      this.nav.pop().then(() => {}, () => {}); // If called very fast in a row, pop will reject because no pages
  }, 500);
});

Edit:
seems like the default is:

    if (this._menuCtrl && this._menuCtrl.isOpen()) {
      return this._menuCtrl.close();
    }

    const navPromise = this.navPop(); // cool method to pop from the active navigation
    if (!navPromise) {
      // no views to go back to
      // let's exit the app
      if (this._config.getBoolean('navExitApp', true)) {
        console.debug('app, goBack exitApp');
        this._plt.exitApp();
      }
    }
    return navPromise;

Hello all! So back button support for PWA's is actually enabled by our deeplinker. Here is an example of the conference app using our @IonicPage() decorator that enables linking between pages. We have not pushed this hard yet as it has some issues that need polishing out, but the good news is that we are actually working on those fixes now. The latest nightly of ionic-angular includes some of these fixes and we have even more coming very soon. You can see this in action here. Thanks for using Ionic!

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.

Was this page helpful?
0 / 5 - 0 ratings