angular - 如何在纯 Typescript 中生成 Escape 按键(不带 JQuery)

Question

我正在尝试在 Angular 单元测试中触发 Escape 按钮按下事件。

    const event = document.createEvent('UIEvent');
    event.initUIEvent('keydown', true, true, window, 0);
    (<any>event).keyCode = 27;
    (<any>event).key = 'Escape';
    (<any>event).charCode = 27;

    document.body.dispatchEvent(event);

这根本不起作用(事件永远不会被像 event.which == 27 这样进行适当检查的监听器捕获)。

创建此类事件的正确方法是什么？

这个我也试过，没用

    const event = new Event('keydown', {bubbles: true});
    event.initEvent('keydown', true, true);
    (<any>event).keyCode = 27;
    (<any>event).key = 'Escape';
    (<any>event).charCode = 27;

    document.body.dispatchEvent(event);

Answer 1

你只需要在文档或元素上使用键盘事件

     const event = new KeyboardEvent("keydown",{
     'key': 'Escape'
     });
     document.dispatchEvent(event);

您可以使用 HostListener 对其进行测试

@HostListener('document:keydown', ['$event'])
handleKeyboardEvent(event: KeyboardEvent) {
    console.log(event);
    let keyPressed = event.keyCode;
    if (keyPressed === 27) {
       console.log('Escape!');
    }
}