Angular：不推荐使用keyCode [重复]答案

【问题标题】：Angular: keyCode is deprecated [duplicate]Angular：不推荐使用keyCode [重复]
【发布时间】：2020-05-26 21:39:34
【问题描述】：

在我的应用程序中，我有一个渲染列表组件的功能，如果我按下左箭头或右箭头，无论我在屏幕上的任何位置以及选择的任何内容，我都会浏览其元素并且列表选择会发生变化。为此，我使用以下代码：

@HostListener('document:keydown', ['$event'])
handleKeyboardEvent(event: KeyboardEvent): void {
  if (!this.isComparisonWindow) {
    if (event.keyCode === 37) {
      this.navigateLeft();
    } else if (event.keyCode === 39) {
      this.navigateRight();
    }
  }
}

这很简单。我遇到的问题是我收到警告

keyCode is deprecated. (deprecation) tslint(1)

进一步的研究证明这是真的。但是我找不到可以轻松实现上述代码并适用于 Chrome、IE11、Firefox 和最好是 Safari 的 keycode 替代方案。大多数答案都提供了库或额外的代码来检查多个案例而不是只检查一个案例。

所以我要问，目前公认的 keycode 替代方案是什么，它的工作方式相同但未被弃用？

【问题讨论】：

这能回答你的问题吗？ How to detect escape key press with pure JS or jQuery?

标签： javascript angular

【解决方案1】：

您可以使用.key 或.code，它们现在得到了广泛的支持

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key#Browser_compatibility

【讨论】：

【解决方案2】：

改成这样：

@HostListener('document:keydown', ['$event'])
handleKeyboardEvent(event: KeyboardEvent): void {
  if (!this.isComparisonWindow) {
    if (event.key === 'ArrowLeft') {
      this.navigateLeft();
    } else if (event.key === 'ArrowRight') {
      this.navigateRight();
    }
  }
}

【讨论】：