イオン3ブロックバックボタンイベント

Question

私はバックボタンイベントをインターセプトしたいと思います。 リスナーが呼び出されると、すぐにバック信号がトリガーされます。

これは私が試したものです：

document.addEventListener("backbutton",() => { 
     console.log("[WARN] BackBtn pushed"); 
     console.log("TextboxVal: " + this.inputValue); 
     this.showConfirm(); 
     document.removeEventListener("backbutton"); 
    }); 

私は "this.inputValue" 値を失いたくありません。 しかし、ほとんどの場合、すでに消えてしまっています。

Answer 1

ページを閉じる前にアラートを表示したいと思います。

あなたはそのためのNavGuards使用することができますいくつかのケースでは

を、開発者が残しビューと 入りを制御することができるはずです。これを可能にするために、NavControllerは、ionViewCanEnter およびionViewCanLeaveの方法を有する。角のルートガードに似ていますが、 はNavControllerと統合されています。私は自分でそれを行ってどのように

// ... 

    ionViewCanLeave() { 

    if(this.inputValue) { 
     // Show the alert 
     this.presentConfirm(); 
    } 

    // Will leave if the input is null 
    return this.inputValue === null; 
    } 

    presentConfirm() { 
    let alert = this.alertCtrl.create({ 
     title: 'Exit', 
     message: 'Do you want to exit?', 
     buttons: [ 
     { 
      text: 'Cancel', 
      role: 'cancel' 
     }, 
     { 
      text: 'Exit', 
      handler:() => { 

      // Allow the user to exit this page 
      this.inputValue = null; 

      // Go back to the previous page 
      setTimeout(() => { this.navCtrl.pop(); }, 500); 

      } 
     } 
     ] 
    }); 
    alert.present(); 
    } 

Answer 2

ザッツ：私は私自身のカスタムBackBTN方法を設定することができます。これにより

constructor(public plt: Platform) { 
    //Catch BackBTN Event 
     plt.ready().then(()=> { 
      plt.registerBackButtonAction(()=> { 
      this.showConfirm(); 
      }) 
     });​ 
} 

showConfirm() { 
     let confirm = this.alertCtrl.create({ 
     title: this.confirm, 
     message: this.confirm_msg, 
     buttons: [ 
      { 
      text: this.disagree, 
      handler:() => { 
       console.log("Saved changes"); 
       this.dismiss(); 
      } 
      }, 
      { 
      text: this.agree, 
      handler:() => { 
       console.log("Discard changes"); 
       this.viewCtrl.dismiss(); 
      } 
      } 
     ] 
     }); 
     confirm.present(); 
    } 
    } 

。