ionic v4 關於返回鍵監聽 （hardware back button）

android手機上的返回鍵，會自動的使路由后退。但少數時候我們可能不需要這個后退功能，希望自己監聽點擊回退操作。

比如，想通過點擊返回按鈕關閉一個modal，並且不想后退。

1.使用@HostListener 監聽ionBackButton事件

@HostListener('document:ionBackButton', ['$event'])
private overrideHardwareBackAction($event: any) {
　　$event.detail.register(100, async () => {
　　// Do what you want
　　this.modalController.dismiss();
　});
}

注意這個 $event.detail.register

2.使用 subscribeWithPriority 訂閱 platform.backButton

 private handleHardwareBackButton(): void {
    const sub = this.platform.backButton.subscribeWithPriority(9999, () => {
      console.log('called');
      this.dismiss();
    });
    this.subscriptions.push(sub);
  }

  ngOnInit() {
    this.getStates(this.payload);
    this.handleHardwareBackButton();
  }

  ngOnDestroy() {
    unsubscribeSubscriptions(this.subscriptions);
  }

這個方法同樣是有效的，不要忘記取消訂閱，不過我不知道使用多少優先級是最合適的，這方面的文檔實在太少。

 

使用@HostListener 不能手動取消監聽，想要手動控制可以使用Renderer2（現在還有Renderer3，不過我沒用過）。

 

希望幫助到使用ionic 4和我有同樣問題的人。