assign phong cách với * ngIf đánh giá trong angular2

Question

Đây là những gì tôi có:

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> 

trong home.ts tôi đã xác định các biến myVar và tôi đã gán cho nó một giá trị.

Tôi muốn gán lớp có biên giới vào phần tử của danh sách của tôi có giá trị bằng myVar và gán một lớp khác nếu giá trị của phần tử đó khác.

Answer 1

* ngNếu hoạt động nếu bạn thay đổi biểu mẫu {{myVar}} thành myVar (không nội suy) trong biểu thức.

<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> 

---

Mặc dù tôi muốn bạn sử dụng ngClass đây, nhiều giải pháp sạch hơn và tốt hơn.

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

HOẶC

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