如何在Ionic的選項卡上更改導航警衛？

Question

我正在使用Ionic 2.我有一個觀點，應該提示用戶確認他們想要在離開時離開（當時正在播放視頻，這可能是意外導航）。

我有，當用戶點擊在頂部導航，或回硬件按鈕（的Android）後退按鈕時，使用下面的代碼爲這個工作的罰款：

// About to leave 
    ionViewCanLeave() { 
    this.api.getDefaultMedia().pause(); 

    return new Promise((resolve, reject) => { 
     if(!this.allowedToLeave) { 
     let confirm = this.alertCtrl.create({ 
      title: 'Are you sure?', 
      message: 'If you leave a class you will need to start over. Are you sure you want to leave? If you need a break you can pause by tapping the video.', 
      buttons: [{ 
      text: 'OK', 
      handler:() => { 
       this.allowedToLeave = true; 
       resolve(); 
      }, 
      }, { 
      text: 'Cancel', 
      handler:() => { 
       reject(); 
      } 
      }], 
     }); 
     confirm.present(); 
     } 
    }); 
    } 

視圖坐落在一個標籤。點擊不同的標籤不會調用此功能，所以用戶不會被提示，並且標籤只是切換。

如何在選項卡上顯示此提示更改？此視圖不是根標籤頁。

-

我一直在使用ionViewWillLeave()嘗試，這是稱爲在標籤的變更，但不允許的方式來阻止用戶切換。下面的代碼確實顯示提示，但該選項卡之後發生了變化：

// Called when user exits page via tab 
    ionViewWillLeave() { 
    this.api.getDefaultMedia().pause(); 

    if(!this.allowedToLeave) { 
     let confirm = this.alertCtrl.create({ 
     title: 'Are you sure?', 
     message: 'If you leave a class you will need to start over. Are you sure you want to leave? If you need a break you can pause by tapping the video.', 
     buttons: [{ 
      text: 'OK', 
      handler:() => { 
      this.allowedToLeave = true; 
      this.leave(); 
      }, 
     }, { 
      text: 'Cancel', 
      handler:() => { 
      // Do nothing 
      } 
     }], 
     }); 
     confirm.present(); 

     return false; 
    } 
    } 

    // Leave the view 
    leave() { 
    this.navCtrl.pop(); 
    } 

Answer 1

你並不需要爲這個承諾，你只需要返回true或false如果用戶能夠離開頁面，所以如果他想離開並在提醒中確認這一點，您將allowedToLeave設置爲true並彈出您的頁面，它會再次呼叫ionViewCanLeave，但這次它不會輸入您的if語句。

// About to leave 
    ionViewCanLeave() { 
    this.api.getDefaultMedia().pause(); 

    if(!this.allowedToLeave) { 
     let confirm = this.alertCtrl.create({ 
     title: 'Are you sure?', 
     message: 'If you leave a class you will need to start over. Are you sure you want to leave? If you need a break you can pause by tapping the video.', 
     buttons: [{ 
      text: 'OK', 
      handler:() => { 
      this.allowedToLeave = true; 
      this.navCtrl.pop(); 
      }, 
     }, { 
      text: 'Cancel', 
      role: 'cancel' 
     }], 
     }); 
     confirm.present(); 
    }; 
    return true; 
    } 

希望這會有所幫助。