angular - HostListener 分析组合按键

Question

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

@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);
}

Answer 1

尽管 Frank Modica 的解决方案有效，但使用 Angular's key event filtering and pseudo-events将是一个更具可读性和更清晰的解决方案:

@Directive({
    selector: '[keyHandler]'
})
export class KeyHandlerDirective {

    @HostListener('keydown.shift.tab', ['$event'])
    onKeyDown(e) {
        // optionally use preventDefault() if your combination
        // triggers other events (moving focus in case of Shift+Tab)
        // e.preventDefault();
        console.log('shift and tab');
    }
}

// in template:
<input type="text" keyHandler />

可以找到有关伪事件如何工作的更多示例 here .