Angular JS2 中的 [NgClass] 和 [class] 有什么区别？答案

【问题标题】：what is the differences between [NgClass] and [class] in Angular JS2?Angular JS2 中的 [NgClass] 和 [class] 有什么区别？
【发布时间】：2017-10-05 13:15:32
【问题描述】：

如果我们有一个具有这三个属性的视图元素

class="red" [class]="isGreen?green:cyan" [ngClass]="'blue'"

角度合并这些属性的输出还是让其中一个覆盖其他属性

如果我们有

[class]="getElementClass()"

angular 会调用该方法多少次以及何时调用

首先假设该方法将在 1 分钟后返回“红色”，它会返回“绿色”

第一次调用后该元素的类集将是例如

蓝青洋红色红色

第二次通话后它将是：

蓝青色绿色

AngularJS 是如何做到的？

【问题讨论】：

标签： angular binding

【解决方案1】：

角度是否合并输出

是的（另见Plunker）

some dummy code to satisfy SO

[class]="getElementClass()"

每次运行变化检测

AngularJS 是如何做到的？

每次运行更改检测时，都会重新评估绑定

【讨论】：

我复制了所有三种类形式都合并的说法。 ✓ 上面的 plunker 示例当前没有显示 [class] 结果被合并，但是如果你将它从 [class]="isGreen?green:cyan" 更改为例如[class]="isGreen?'green':'cyan'"可以看到合并了。