如何在angular2中通過渲染器（或替代方法）獲取類屬性

我在angular2中找到了nativeElement.classList.add（）的替代方法。（原始問題在這裏描述：looking for nativeElement.classList.add() alternative）如何在angular2中通過渲染器（或替代方法）獲取類屬性

但現在我想要在呈現新的類之前獲得類屬性。因爲如果顏色值發生變化，新的類將被添加，但舊的不會被刪除。

所以我試圖解決

<button md-button color="accent" class="myClass"></button>

到

<button md-button color="accent" class="myClass md-accent"></button>

當顏色屬性更改警告，它應該呈現

<button md-button color="warn" class="myClass md-warn"></button>

現在它呈現

<button md-button color="warn" class="myClass md-accent md-warn"></button>

所以我試圖做的是：在更新this.color_之前，刪除md-this.color_類。

@Input() 
set color(value: string) { 
    // READ CLASS ATTRIBUTE HERE, SO I CAN REMOVE THE OLD md-this.color_ 
    this.color_ = value; 

    this.renderer.setElementClass(this.elementRef, 'md-' + this.color_, true); 
}

通過nativeElement獲取屬性不是一個選項，因爲這在webworkers中不起作用。

任何想法的？

來源

2016-02-26 BakGat

盲目刪除它你就不能調用'this.renderer.setElementClass（this.elementRef刪除它，「MD-」 + this.color_，假）;'？ –

我猜你只需要與

this.renderer.setElementClass(this.elementRef.nativeElement, 'md-' + this.color_, false);

來源

2016-02-26 13:33:02

哦不...... :-)就這麼簡單。 – BakGat

這確實消除了這個類。但是當它是列表中的最後一個類時，元素上的class屬性保持爲空，這是無效的html。這是Angular中的一個錯誤。在這種情況下，該屬性可以移除嗎？ – BakGat

似乎沒有辦法。無論您使用哪種方式更新類，Angular在最後一個類被移除時都會留下'class'。解決方法是添加一些您只是忽略的虛擬類，但防止列表變空。 –

如何在angular2中通過渲染器（或替代方法）獲取類屬性

回答

相關問題