Wiele klas w ngClass

Question

Próbuję dodać wiele wartości w * ngClass, co używane do pracy na poprzednich wydań alfa i nie wydają się działać teraz na angular2 BETA:

<i *ngClass="['fa','fa-star']"></i> 

To wywołuje błąd :

EXCEPTION: TypeError: Cannot read property 'add' of undefined in [['fa','fa-star'] in PostView@30:27]

Czego mi tu brakuje?

Answer 1

Należy użyć nawiasów kwadratowych, aby utworzyć powiązanie właściwości. Zobacz this plunk

<i [ngClass]="['fa','fa-star']"></i> 

Answer 2

Jeśli nie będzie zmiany tych klas dynamicznie następnie używając ngClass jest przesadą. Możesz po prostu użyć class="fa fa-star" w swoim szablonie.

ngClass Powinny być używane, gdy chcesz je włączyć i wyłączyć dynamicznie. Jest przykładem w docs:

komponentu miałoby metodę:

setClasses() { 
    return { 
    saveable: this.canSave,  // true 
    modified: !this.isUnchanged, // false 
    special: this.isSpecial,  // true 
    } 
} 

następnie użyć ngClass w szablonie tak:

<div [ngClass]="setClasses()">This div is saveable and special</div> 

Answer 3

Można także zbudować ciąg zawierający kilka klas .

W tym przypadku additionalClass jest var @Input zawierający nazwę klasy i aktywną jest wartością logiczną, która określa aktywnego klasa

<div [ngClass]="(additionalClass + ' ' + (active ? 'active' : ''))"></div>