Angular 2，在ngFor中使用ngClass和条件

Question

我有ngFor循环显示数据，并且基于该循环中的某些内容是真还是假，我该如何更改css？我试过的，对我不起作用。

HTML

<div class="class" *ngFor="let something of something" [ngClass]="{'classno2': sent}">
    <div> {{something.name}}
    </div>
</div>

TypeScript

something;

this.something = [
    {name: "NAMEE", sent: false},
    {name: "NAMEE2", sent: true},
]

CSS

.class {
    color: red;
}
.classno2 {
    color: blue;
}

我没有错误，但没有任何改变。

Answer 1

您可以像这样使用[ngClass]：

<div *ngFor="let some of something" [ngClass]="{'classno2': some.sent, 'class': !some.sent}">
    <div> {{some.name}}
    </div>
</div>

上面将根据sent是真还是假来处理样式。

工作人员：https://plnkr.co/edit/45regTAQvbCu61kvUAlJ?p=preview

Answer 2

正确的语法：

<div class="class" *ngFor="let smth of something" [class.classno2]="smth.sent">
    <div> {{something.name}} </div>
</div>