Angular：为什么“keydown”事件侦听器多次触发？

Question

我在我的 Angular 应用程序组件的构造函数中声明的事件侦听器中有以下代码：

window.addEventListener('keydown, event => { console.log('key pressed'); });

每当我在组件存在时按任意键时都会触发。问题是它发射了 6 次而不是一次。

我想知道的：

1）为什么它会触发不止一次？

2）我怎样才能让它只火一次？

Answer 1

不能肯定地说，但问题似乎是每次此组件实例化时您都手动注册一个事件侦听器并且从不清除它，并且您正在创建内存泄漏，其中侦听器和组件永远不会被正确销毁。这就是为什么您不想手动执行此类操作并且应该让 angular 为您处理的部分原因：

@HostListener('window:keydown', [])
onWindowKeyDown() {
  console.log('keydown')
}

现在 angular 将处理注册/取消注册您的听众。