指令不处理事件

Question

我必须创建一个指令来处理“关键事件事件”。所以我这样做：

@Directive({
    selector: 'p-dropdown',
})
export class AccessibilityDropdownDirective implements OnDestroy {

constructor(private dropdown: Dropdown,
    private elementRef: ElementRef) {
    this.dropdownHtmlElement = this.elementRef.nativeElement as HTMLElement;
}

ngOnInit(): void {
    console.log("here")
    //  this.replaceKeyDownAction();
    // this.subscribeToDropdownShowEvent();
    // this.subscribeToDropdownHideEvent();
}

ngOnDestroy(): void {
    this.subscriptions.unsubscribe();
}

@HostListener('keydown', ['$event'])
onKeyDown(event: KeyboardEvent) {
    console.log(event);//here is never called
    if (event.keyCode == 13) {
        this.dropdown.show();
    }
}

如果我按下“回车”，也不会调用按键事件。调用ngonInit 中的console.log。我需要处理这个事件，有人可以帮助我吗？

Answer 1

@HostListener('window:keydown', ['$event'])
onKeyDown(event: KeyboardEvent) {
    console.log(event);//here is never called
    if (event.keyCode == 13) {
        this.dropdown.show();
    }