如何獲取Angular 2中當前元素的引用？

例如我有一個功能itemDragged()。如何在該函數中獲得ion-item-sliding的參考以獲取其當前類屬性？如何獲取Angular 2中當前元素的引用？

<ion-item-sliding *ngFor="let activity of activities" (click)="showModalInfo(activity)" (ionDrag)="itemDragged($event)">

2017-02-13 Kin

你檢查過'$ event.target'嗎？ – Satpal

@Satpal'undefined' – Kin

我認爲這可能有所幫助：http://stackoverflow.com/questions/32693061/angular-2-typescript-get-hold-of-an-element-in-the-template –

您可以使用引用變量模板

<ion-item-sliding #iis *ngFor="let activity of activities" (click)="showModalInfo(activity)" (ionDrag)="itemDragged(iis)"> 
<p>{{iis.class}}</p>

2017-02-13 12:48:42

它與'$ event'返回相同。 – Kin

但在事件類挖就可以得到一流這樣

itemDragged(event){ 
    console.log(event._elementRef.nativeElement.className); 
    }

2017-02-13 13:31:25

如果引用以'_'（_elementRef）開始，通常意味着它在內部使用並且不能直接使用。不能保證任何這種結構將被保留 – Greg

你會使用一個ViewChild，並獲得nativeElement？

在組件API中，請注意關鍵是您將如何在代碼中訪問它，傳遞給ViewChild的值是您給組件的「＃」標識（這是ES6，在TS中您將使用ViewChild註釋）：

... 
queries { 'myElement' : new ViewChild ('myelement') } 
...

在標記：

<div #myelement></div>

在您的組件功能（處理程序，無論你需要抓住它），在nativeElement屬性讓你的HTML元素的引用，所以你可以設置innerHTML，添加一個處理程序，或任何你需要做的事情。有，當然其他方式來做到這一點通過結合性質（例如，你可以綁定到（點擊）或[innerHTML的）：

... 
this.myElement.nativeElement... // etc. 
...

另外，如果你想使用多個元素的單個處理器（比方說，一堆不同的可點擊的div），你可以使用event.target來做同樣的事情。問題在於，因爲現在提供ID被認爲是「不好的」，所以你必須有一種替代方式來識別哪個DIV被點擊了。你可以檢查標籤（innerHTML），你可以給它一個虛擬樣式並檢查它，等等。

2017-02-13 13:48:09

回答