2017-05-11 51 views
0

這可能是一個完全愚蠢的問題(嘿!那對於SO非常適用...)。這裏是我的問題:我的主要模塊模板中有多個* ngFor,它實際上是重複子組件,我直接通過父組件中的ViewChildren裝飾器(通過QueryList和ElementRef)向它添加類和內聯樣式。父模板看起來很基本的,就像這樣:Angular2將nativeElement添加到組件的原型

<div #child *ngFor="let child of children"> 
    <app-child-component></app-child-component> 
</div> 

的parrent組件看起來是這樣的:

@ViewChildren('child') children_elements: QueryList<ElementRef>; 
... do whatever I do with children ... 

我知道我可以在子組件中的綁定類和風格或使用ngStyle/ngClass。但是這些對我來說並不好,因爲我有特定的用例,我需要根據它們在模板中的索引來定位模板子,我需要將它們從數組中動態地注入到模板中。好了,一切都很好我的解決方案,但我不知道如果我能擺脫纏繞div元素,所以我就只重複子組件這樣的:

<app-child-component #child *ngFor="let child of children"></app-child-component> 

的問題是,我想,該角的QueryList是不可更改的,所以我不能添加或刪除類或樣式到它的項目。這同樣適用於elementRef和Renderer,或者在host元素上調用好的老式優雅的querySelectorALl()(即this.elementRef.childNodes或document.querySelectorALl('child')...在其子節點上沒有'nativeElement',並且沒有'風格'或'classList'或類似的東西都沒有。

我懷疑我是問正確的問題,但在我的腦海裏聽起來像這樣:「我可以以某種方式增強我的孩子組件,所以當它是通過ViewChildren從它的父級訪問的,它有類似.elementRef.nativeElement?「或者」是否有其他方式來訪問模板視圖以便能夠使用重複注入的組件進行操作?「(我嘗試閱讀ViewRef,EmbeddedView和其他人,但它使我堅果......)

如果你認爲thi s是廢話,我不應該問,請,只是downvote這一點,我可能會這樣做自己...

謝謝!

回答