硬件后退按钮关闭启用Tab的Ionic 3应用程序上的应用程序

Sam*_*ath 9 android ionic-framework ionic2 ionic3 angular

当用户点击my profile页面(或标签)时,用户没有登录,然后显示login page如下所示.login page它在哪里header back button,它工作正常(你可以看到下面的代码).我需要相同的功能当用户击中了hardware back button on Android device.但它关闭了应用程序.你能告诉我如何解决这个问题吗?如果您需要更多信息,请告诉我.

我-profile.ts

constructor(public navCtrl: NavController, public app: App, public userService: UserService
        ) {
        if (!this.userService.userDetails) {
            this.app.getRootNav().setRoot('Login', { profile: true });
            return;
        }
    }
Run Code Online (Sandbox Code Playgroud)

login.ts

constructor(public navCtrl: NavController, public navParams: NavParams) {
        this.profile = this.navParams.data.profile;
    }

    back() {
        if (this.profile) {//not logged in user
            this.navCtrl.setRoot('TabsPage');
        }
    }
Run Code Online (Sandbox Code Playgroud)

的login.html

<ion-header>
  <ion-navbar>
    <ion-buttons left>
      <button ion-button *ngIf="profile" (click)="back()" tappable><ion-icon name="arrow-back"></ion-icon></button>
    </ion-buttons>
    <ion-title>login</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

</ion-content>
Run Code Online (Sandbox Code Playgroud)

Gab*_*eto 15

您可以使用Platform的registerBackButtonAction()方法来处理用户按下本机后退按钮的时间.

import { Platform } from 'ionic-native';
...
constructor(public platform: Platform){

  platform.registerBackButtonAction(() => {
    if (navCtrl.canGoBack()) { // CHECK IF THE USER IS IN THE ROOT PAGE.
      navCtrl.pop(); // IF IT'S NOT THE ROOT, POP A PAGE.
    } else {
      platform.exitApp(); // IF IT'S THE ROOT, EXIT THE APP.
    }
  });

}
Run Code Online (Sandbox Code Playgroud)

但是这里的情况是你正在设置root而不是推送页面,所以这是Ionic的正常行为,当在root页面中没有任何内容可以弹出时,应用程序将被关闭.

在这种情况下,您可以在login.ts上执行类似的操作

platform.registerBackButtonAction(() => {
  this.back();
});
Run Code Online (Sandbox Code Playgroud)

因此,每当用户进入登录页面并点击硬件后退按钮时,它只需调用您的back()方法,即将根设置为另一个页面.

希望这可以帮助.