如何爲自定義元素使用HostListener？ （角2）

Question

我可以使用HostListener文檔聽：

@HostListener('document:click', ['$event']) 
someAction(event) { 
    console.log('done'); 
} 

我如何監聽click事件元素。例如：

<span class="someClass"></span> 

Answer 1

岡特的答案是正確的，但你可以用一個HostListener指令使用的更多的全球意義（如喜歡/喜歡按鈕）。

@Directive({ 
selector: '.favorite' 
}) 
class FavoriteDirective(){ 
@HostListener('click', ['$event.target']) onClick(_element) { 
    ... 
    } 
} 

Answer 2

@HostListener('click', ['$event'])是監聽主機元素本身的事件。沒有其他用例可以使用。

一個例外是全局事件，例如您使用全局事件目標，如window:,document:或body。

要監聽任意元素使用

<span class="someClass" (click)="someAction($event)"></span>