HostListener分析组合键按下 [英] HostListener to analyse combination key press

问题描述

我试图跟踪用户何时使用键盘按下Shift + Tab组合键，但无法触发该事件

I am trying to trace when a user presses a Shift+Tab combination key using keyboard, but I am not able to fire that event

@HostListener('keyup', ['$event'])
@HostListener('keydown', ['$event'])

onkeyup(event) {
  if (event.keyCode == 16 && event.keyCode == 9) {
    this.isShift = true;
    console.log("On Keyup " + event.keyCode);
  }
}

onkeydown(event) {
  console.log("On KeyDown" + event.keyCode);
}

推荐答案

当我这样做时它会起作用:

It works when I do this:

@Directive({
  selector: '[test-directive]'
})
export class TestDirective {
  @HostListener('keydown', ['$event']) onKeyDown(e) {
    if (e.shiftKey && e.keyCode == 9) {
      console.log('shift and tab');
    }
  }
}

<input type="text" test-directive />

请注意， keyup 可能很棘手，因为 tab 可能会使元素失去焦点.因此，在 keyup 触发时，您可能在下一个元素上，因此 keyup 可能实际上在该元素上触发了.因此，这取决于您的需求.但是 keydown 可用于当前元素.

Note that keyup can be tricky because tab may unfocus the element. So by the time keyup fires, you may be on the next element, so keyup may actually fire on that element. So it depends on what you need. But keydown works for the current element.

这篇关于HostListener分析组合键按下的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！