Angular中ngClass如何设置常驻默认类并按需新增条件类？

最优实现方案 #

始终生效的固定类不需要放到[ngClass]绑定中，直接写到原生class属性里即可，[ngClass]仅控制条件类的新增，Angular会自动合并原生类和动态生成的类，优化后代码如下：

<span
    class="timeString"
    [ngClass]="{'disabledText': conditionalExpression}">
</span>

你原来的CSS代码不需要做任何修改，运行效果和你之前的实现完全一致，且没有冗余的'timeString': true写法。

可选替代写法（数组语法） #

如果需要全量用[ngClass]控制，也可以用数组语法实现：

<span
    [ngClass]="['timeString', conditionalExpression ? 'disabledText' : '']">
</span>

该写法和上面的最优方案效果一致，不过可读性稍低，更推荐使用固定类写原生class的方案。

内容的提问来源于stack exchange，提问作者Mauricio Gracia Gutierrez