如何检查event.target是否等于特定组件？

Question

我有一个使用标记<example-form-component>的ExampleFormComponent和一个标记为<dialog-box-component>的DialogBoxComponent。我正在捕获DialogBoxComponent中的keyup事件，如果event.target是<example-form-component>，我想做一些动作。

代码：

export class DialogBoxComponent {

    constructor(private elementRef: ElementRef) {
    }

    @HostListener('document:keyup', ['$event'])
    handleKeyPressEvent(event) {

        // how can I check if event.target is ExampleFormComponent?

    }
}

Answer 1

'keyup'event.target将返回触发事件时具有焦点的元素，否则将返回DOM的根元素。

因此，如果您的DialogBoxComponent在触发'keyup'时具有焦点，那么您的event.target将成为DialogBoxComponent。

Here是'keyup'上的MDN文档。

检查this StackBlitz，在使用和不使用聚焦按钮触发事件时查看控制台。