Angular2 [ngClass] - 条件付きクラスとの直接バインディングの結合

Question

私は現在、要素上に[ngClass]の2つの異なる実装を持っています。

[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

あなたが直接

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

としてテンプレートにcustomClassesを設定することができ、またそのように一緒に

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

を入れて、条件に基づいて、あなたのクラスを追加します [ngClass]を使用することができます