angular 2 HostListener - keydown space 事件在 IE 中不起作用

Tar*_*nko 3 internet-explorer typescript ecmascript-6 angular2-template angular

我在 IE11 中遇到 @HostListener问题。我需要捕捉用户何时使用 keydown 事件作为空格,我的代码非常简单,它在 Chrome 和 FireFox 中运行良好,但在 IE 中不起作用。

import {Component, HostListener} from '@angular/core';

@Component({
  selector: 'home',
  styleUrls: ['./home.component.css'],
  templateUrl: './home.component.html'
})
export class HomeComponent {
    @HostListener('window:keydown.control.space', ['$event'])
    @HostListener('window:keydown.space', ['$event'])
    spaceEvent(event: any) {
        alert('space key!');
    }
}
Run Code Online (Sandbox Code Playgroud)

在IE开发者工具中,我没有看到任何错误或警告,我不知道如何解决这个问题。任何建议如何解决这个问题?

Tar*_*nko 6

我找到了解决方案。IE 在处理许多不同的事件时还不能正常工作,需要使用@HostListener('window:keydown', ['$event'])然后捕获一些keyCode

例子:

import {Component, HostListener} from '@angular/core';

@Component({
  selector: 'home',
  styleUrls: ['./home.component.css'],
  templateUrl: './home.component.html'
})
export class HomeComponent {

    @HostListener('window:keydown', ['$event'])
    spaceEvent(event: any) {
        if(event.ctrlKey && event.keyCode == 32)
            console.log('ctrl + space');
        else if(event.keyCode == 32)
            console.log('space');
    }
}
Run Code Online (Sandbox Code Playgroud)