web-dev-qa-db-ja.com

ハードウェアの戻るボタンは、タブが有効になっているアプリを閉じますIonic 3 app

ユーザーがmy profileページ(またはタブ)を押すと、ユーザーはログインしておらず、以下に示すようにlogin pageが表示されます。login pageheader back buttonとは正常に動作しています(以下のコードを参照してください)。ユーザーがhardware back button on Android deviceを押したときに同じ機能が必要ですが、アプリが閉じます。この問題を解決する方法を教えてください。さらに情報が必要な場合はお知らせください。

my-profile.ts

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

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');
        }
    }

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>
9
Sampath

プラットフォームの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.
    }
  });

}
_

ただし、ここでのケースは、ルートを設定していてページをプッシュしていないため、これはIonicの通常の動作であり、ルートページにあり、ポップするものがない場合、アプリは閉じられます。

この場合、login.tsでこのようなことを行うことができます

_platform.registerBackButtonAction(() => {
  this.back();
});
_

したがって、ユーザーがログインページにアクセスしてハードウェアの戻るボタンを押すたびに、back()メソッドを呼び出すだけで、ルートが別のページに設定されます。

お役に立てれば。

15
Gabriel Barreto

インポート時にファイルapp.module.tsのプロパティnavExitAppfalseに設定するだけです

IonicModule.forRoot(YourApp, {
  navExitApp: false
}),

簡単! registerBackButtonActionイベントに触れる必要はありません。

3
Dominik