classi multiple in ngClass

Question

che sto cercando di aggiungere più valori a * ngClass, quello usato per lavorare su versioni alpha precedenti e non sembra funzionare ora in angular2 beta:

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

Produce un errore :

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

Cosa mi manca qui?

Answer 1

È necessario utilizzare parentesi quadre per creare il binding di proprietà. Vedere this plunk

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

Answer 2

Se non si ha intenzione di essere la modifica di queste classi dinamicamente quindi utilizzando ngClass è eccessivo. Puoi semplicemente usare class="fa fa-star" nel tuo modello.

ngClass deve essere utilizzato quando si desidera attivare e disattivare questi in modo dinamico. C'è un esempio nella documentazione:

Il componente dovrebbe avere un metodo:

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

quindi utilizzare ngClass nel modello in questo modo:

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

Answer 3

È possibile anche costruire una stringa contenente diverse classi .

In questo caso additionalClass è una var @Input che contiene il nome di classe e attiva è un valore booleano che imposta la classe attiva

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