在mat-cell中应用ngclass得到错误角度8答案

【问题标题】：apply ngclass in mat-cell getting error angular 8在mat-cell中应用ngclass得到错误角度8
【发布时间】：2020-02-16 18:12:34
【问题描述】：

我正在尝试使用 ngclass 来满足我的条件，以将 css 应用于以下 html 代码，但它显示错误。

我想使用两个类，即 colorRed 和 colorOrange

这是我的两个类 (CSS)

    .colorRed{
        color:red;
    }
    .colorOrange{
        color: orange;
    }

这是条件

如果百分比 >=5% 且
如果百分比 >=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>

【问题讨论】：

你遇到了什么错误？
@NicholasK 错误：模板解析错误：
element.salaryIncrease>= 5% 这不起作用。您不应该使用 % 进行比较 - 它不是 JS 中的运算符。

标签： angular angular8 ng-class

【解决方案1】：

您收到模板解析错误，因为您在比较期间使用了 % 符号，而 % 符号不能用于比较。只需比较百分比值。

此外，在标准方案中，仅存储百分比值的值。 % 符号仅在需要时添加

适合您的工作示例

https://stackblitz.com/edit/angular-5fbpjc?embed=1&file=app/table-basic-example.html

【讨论】：