我有一个数据数组我循环*ngFor
。我只是想检查一个值是否低于或高于0,所以我做了一个checkPositive函数。这是HTML代码:
<div class="col-xs-4" [ngStyle]="{'color':color}">
<span>{{checkPositive(contract.transactionAmount) | number: '1.2-2'}} {{contract.contractCurrency}}</span>
</div>
和ts文件
checkPositive(amount){
if(amount > 0){
this.color="blue";
return amount;
}
else{
this.color="red";
return amount;
}
}
我得到的结果是第一个数字没有颜色设置。
,控制台返回
Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'undefined'. Current value: 'blue'.
我明白问题是什么,我只是不知道如何解决它。
答案 0 :(得分:2)
问题是您对列表中的所有条目使用相同的组件属性。
试着这样做
<div class="col-xs-4" [ngStyle]="{'color': contract.transactionAmount > 0 ? 'blue':'red'}">
<span>{{ contract.transactionAmount | number: '1.2-2'}} {{contract.contractCurrency}}</span>
</div>
或
<div class="col-xs-4" [style.color]="contract.transactionAmount > 0 ? 'blue':'red'">