Angular2 [ngClass]-將直接綁定與條件類結合

Question

我目前在元素上有兩種不同的[ngClass]工作實現；

[ngClass]="{ selected: element.isSelected, highlighted: element.isHighlighted}"

和

[ngClass]="element.customClasses"

是否可以將這兩種方法結合在模板中，還是必須在組件中創建一個方法以根據上述邏輯返回類數組？

謝謝！

Answer 1

我選擇使用[class.*]設置條件類，而讓[ngClass]來處理綁定；

<div 
  [ngClass]="element.customClasses" 
  [class.selected]="element.isSelected"
  [class.highlighted]="element.isHighlighted"
></div>

Answer 2

您可以直接將customClasses設置為模板，如下所示

<span class="customClasses">something</span>

而且您還可以使用[ngClass] ，它會根據條件追加類，因此將它們放在一起

<span [ngClass]="{ selected: element.isSelected, 
                 highlighted: element.isHighlighted}" 
                 class="customClasses">something
</span>