对于Angular 4中的第一个条件,ngClass在ngFor内部不起作用

时间:2017-12-19 09:27:16

标签: angular

我正在尝试使用带有条件的[ngClass]来显示for循环中的不同图标。它完全适用于第二种情况,但它不能用于第一种情况。

<i [ngClass]="{'fa fa-heart text-warning':z.isPinned == true,'fa fa-heart-o text-warning':z.isPinned == false}" (click)=addFavorite(z,i);  aria-hidden="true"></i>

环境:angular / cli - 1.5.0

2 个答案:

答案 0 :(得分:1)

尝试使用三元运算符:

[ngClass]="z.isPinned ? 'fa fa-heart text-warning' : 'fa fa-heart-o text-warning'"

答案 1 :(得分:0)

永远不要使用==运算符,始终===

另外,您是否检查过isPinned是否确实具有真实价值?

最后,您可以使用'fa fa-heart text-warning': z.isPinned,'fa fa-heart-o text-warning': !z.isPinned

进行简化