Angular2 - 檢測專注的DOM元素的名稱

Question

我在頁面上有一堆元素，我需要檢測所選元素的名稱。

例子：

<select (click)="functionDetectName()" name="test1"> 
<select (click)="functionDetectName()" name="test2"> 
<select (click)="functionDetectName()" name="test3"> 

functionDetectName() { 
console.log("What to put here to detect the name of the select element?"); 
} 

所以，當我點擊test1的選擇框，控制檯日誌應該輸出：TEST1，TEST2上時，它應該輸出test2的。

Answer 1

您可以通過$event您functionDetectName()函數，然後得到通過屬性名數據，例如：

<select (click)="functionDetectName($event)" name="test1"> 
<select (click)="functionDetectName($event)" name="test2"> 
<select (click)="functionDetectName($event)" name="test3"> 

functionDetectName(event: MouseEvent) { 
    console.log(event.srcElement.name); 
} 

Answer 2

你可以只通過名稱，如

<select (click)="functionDetectName('test1')" name="test1"> 

，或者如果你真的想要的屬性，你可以做

<select #self (click)="functionDetectName(self.getAttribute('name'))" name="test1">