万一用户按Angular中的Shift键，HostListener不能正常工作

Question

在Angular 6中，我编写了一个函数来检测是否按下了Ctrl按钮：

  @HostListener('document:keydown.control')
  onKeydownHandler() {
    console.log('key down control');
  }

每次按Ctrl按钮，日志都会写入控制台。 但是，如果我按Ctrl + Shift键，则不会写入此日志。 即使释放Shift键，日志也不再写入。

你有什么想法吗？

Answer 1

您只需要简单地装饰它。

  @HostListener('document:keydown.control')
  @HostListener('document:keydown.shift.control')
  @HostListener('document:keydown.control.shift')
  onKeydownHandler() {
    console.log('key down control');
  }

keydown.control ， keydown.shift.control和keydown.control.shift被视为独立的不同事件。

Answer 2

您可以通过使用以下绑定来监听ctrl + shift事件。 并非只有先按下控制键然后再移动时它才起作用。

@HostListener('document:keydown.control.shift')
  onKeydownHandler(e) {
    console.log('key down control', e);
  }

如果要处理其他装饰，只需添加所需数量的装饰器即可。