浏览器后退按钮上的HostListener在Angular中触发两次

Question

我在一个路由的角度应用程序中有一个@HostListener，它只是简单地询问您是否希望在单击浏览器上的后退按钮时离开当前页面。当点击对话框上的"确定"时，会弹出另一个对话框，再次询问您相同的问题。所以我只能假设事件is处理程序被激发了两次。

@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只是报告事件，所以可能是页面被推送/堆叠了两次/多次，我猜在没有看到其他代码的情况下，它要么是

1. 通过导航
2. 通过代码
3. 或路由器/插座

看这里，其他人也发生了同样的事情。所以，试着看看堆栈和导航菜单/路由器控制。这应该对你有帮助！