我不能讓Angular2使用有條件的ngClass樣式和引導標簽。

<h1 [ngClass]="{'label label-warning': yourName=='Daniel', 
                'label label-success': yourName!='Daniel'}">

當我設計應用程序時，ngClass似乎正在刪除“label label-success”中的第一個“label”。當第二個條件為m et時，樣式設置正確，但當滿足第一個條件時，樣式設置不正確。

在檢查元素時，當滿足第二個條件時，樣式是h1.label.label-success，但是當滿足第一個條件時，它被錯誤地樣式化為h1.label-error。

請查看該錯誤的plunker。

https://plnkr.co/edit/qJLWBzCXXUn7hNKEWXIs? p =預覽

我已經按照AngularJS升級指南(https://angular . io/docs/ts/latest/cookbook/a1-a2-quick-reference . html)進行了操作，但無法正常工作

我認為在[ngClass]中，可以在單個對象鍵中傳遞單個類名。因此，只需使用class = & quot標簽& quot并且只在[ngClass]中添加一個條件類

<h1
    class="label"
    [ngClass]="{'label-warning': yourName=='Daniel','label-success': yourName!='Daniel'}">

此外，您可以使用angular 2樣式class[class . class name]= & quot；條件表達式& quot

<h1
    class="label"
    [class.label-warning]="yourName=='Daniel'"
    [class.label-success]="yourName!='Daniel'">

您可以像這樣有條件地添加所需的標簽類(例如label-success ):

<h1 *ngIf="yourName" class="label" 
[class.label-warning]="yourName != 'Daniel'"
[class.label-success]="yourName=='Daniel'">
    Hello {{yourName}}!
</h1>

因此，默認情況下它有一個標簽類，然后您可以根據您的條件追加額外的類。