在 mat-cell 中应用 ngclass 出现错误 angular 8
apply ngclass in mat-cell getting error angular 8
我正在尝试使用 ngclass 来为下面的 html 代码应用 css 但它显示错误。
我想使用两个 class,即 colorRed 和 colorOrange
这是我的两个class (CSS)
.colorRed{
color:red;
}
.colorOrange{
color: orange;
}
这是条件
- 如果百分比 >=5% 且 <10%,则显示橙色
- 如果百分比>=10%需要显示红色
这是我的html
<ng-container matColumnDef="salaryIncrease">
<th mat-header-cell *matHeaderCellDef mat-sort-header> </th>
<td mat-cell [ngClass]="{'colorRed': element.salaryIncrease>= 5% }" *matCellDef="let element" > {{element.salaryIncreas| currency:'':''}}
</td>
</ng-container>
您收到模板解析错误,因为您在比较期间使用了 % 符号,而 % 符号不能用于比较。只需比较百分比值。
同样在标准场景中,只存储百分比值的值。 % 符号仅在需要的地方添加
适合您的工作示例
https://stackblitz.com/edit/angular-5fbpjc?embed=1&file=app/table-basic-example.html
我正在尝试使用 ngclass 来为下面的 html 代码应用 css 但它显示错误。
我想使用两个 class,即 colorRed 和 colorOrange
这是我的两个class (CSS)
.colorRed{
color:red;
}
.colorOrange{
color: orange;
}
这是条件
- 如果百分比 >=5% 且 <10%,则显示橙色
- 如果百分比>=10%需要显示红色
这是我的html
<ng-container matColumnDef="salaryIncrease">
<th mat-header-cell *matHeaderCellDef mat-sort-header> </th>
<td mat-cell [ngClass]="{'colorRed': element.salaryIncrease>= 5% }" *matCellDef="let element" > {{element.salaryIncreas| currency:'':''}}
</td>
</ng-container>
您收到模板解析错误,因为您在比较期间使用了 % 符号,而 % 符号不能用于比较。只需比较百分比值。
同样在标准场景中,只存储百分比值的值。 % 符号仅在需要的地方添加
适合您的工作示例
https://stackblitz.com/edit/angular-5fbpjc?embed=1&file=app/table-basic-example.html