瀏覽器后退按鈕上的 HostListener 在 Angular 中觸發兩次

Question

我在路由的 angular 應用程序中有一個@HostListener ，如果您單擊瀏覽器上的后退按鈕，它只會詢問您是否希望離開您所在的頁面。 在對話框上單擊“確定”時，會彈出另一個對話框再次詢問您。 所以我只能假設事件是處理程序被觸發了兩次。

@HostListener('window:popstate', ['$event'])
  onBrowserBackBtnClose(event: Event) {
    // If we can go back...
    if (this.canGoBack) {
      alert('Are you sure you want to go back and exit the review?');
    }
  }

這是 Angular 中的錯誤還是由於路由機制導致的正常行為？ 有沒有辦法解決這個問題？ 或者解決它？ 或者，當您單擊后退按鈕時，Angular 中是否有更好的方法來執行某些操作？

Answer 1

HostListner 只是報告事件，因此可能是頁面被推送/堆疊兩次/多次，我猜沒有看到您的代碼的 rest，它要么

1. 通過導航
2. 通過代碼
3. 或路由器/插座

看這里，其他人也發生了同樣的事情。 因此，請嘗試查看堆棧和導航菜單/路由器控件。 這應該可以幫助你！