如何获取 focus HostListener 的 keyCode

【问题标题】：How to get a keyCode for *focus* HostListener如何获取 *focus* HostListener 的 keyCode
【发布时间】：2018-05-14 06:23:37
【问题描述】：

我有一个指令，它为 HTML DOM 中的活动元素设置焦点样式。目前，它工作正常，但我只需要在按下选项卡按钮时执行此逻辑。

@HostListener('focus', ["$event"])
    onFocus(event: KeyboardEvent) {
        console.log("Focus called from HostListener");
    }

我在 event 对象中没有看到 keyCode 属性。

我怎样才能得到这个事件的keyCode？p>

【问题讨论】：

【解决方案1】：

HTML：

<input (keydown.Tab)="onKey($event)">

TS：

onKey(event:any){
 //Do logic
}

【讨论】：

没关系，但我需要@HostListener('focus', ["$event"]) 上的检测keyCode。如果可能的话。
我不知道你想如何实现这一点，这个事件是当你聚焦时，而不是当你按下键时，它们是 2 个不同的事件，不能在同一个事件检测中组合。我将使用 keytab 检测来编辑我的答案。

【解决方案2】：

简单的把它放在你的html中：

<input (focus)="isFocused($event)" />

或者当散焦时：

<input (blur)="onBlur($event)" />

如果要检测标签：

<input (input)="onInput($event)" />

当然，您可以将两者结合起来。但是，如果您进入输入，(focus) 将触发。

【讨论】：