przypisać styl z * ngIf oceny w angular2

Question

To jest to, co mam:

home.html

<li *ngFor="let item of myList"> 
     <div *ngIf="item.messageText === {{myVar}}" class="bordered">{{item.messageText}}</div> 
     <div *ngIf="item.messageText !== {{myVar}}" class="greyedOut">{{item.messageText}}</div> 
</li> 

w home.ts Mam zdefiniowane zmienna myVar a ja przypisany do tego wartość.

Chcę przypisać obramowane klasy do elementu myList, który ma wartość równą myVar i przypisać inną klasę, jeśli wartość tego elementu jest inna.

Answer 1

* ngJeśli będzie działać, jeśli zmienisz {{myVar}} na myVar (bez interpolacji) w wyrażeniu.

<li *ngFor="let item of myList"> 
    <div *ngIf="item.messageText === myVar" class="bordered">{{item.messageText}}</div> 
    <div *ngIf="item.messageText !== myVar" class="greyedOut">{{item.messageText}}</div> 
</li> 

---

Choć wolałbym, aby korzystać ngClass tutaj, czystsze i bardziej lepszym rozwiązaniem.

<li *ngFor="let item of myList"> 
    <div [ngClass]="item.messageText == item.messageText ? 'bordered': 'greyedOut'"> 
     {{item.messageText}} 
    </div> 
</li> 

LUB

<li *ngFor="let item of myList"> 
    <div [ngClass]="{'bordered': item.messageText == item.messageText, 'greyedOut': item.messageText !== item.messageText }"> 
     {{item.messageText}} 
    </div> 
</li>