ngClass或class =“{{}}”?

时间:2017-08-21 19:00:52

标签: angular ng-class

只是好奇这些方法是否有任何更大的优势?

  <div class="small" ngClass="well-{{small}}">small</div>

  <div class="small" class="well-{{big}}">big</div>

3 个答案:

答案 0 :(得分:3)

您使用ngClass的方式并不重要。虽然,ngClass允许我们有条件地添加类,即

<some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>

使用class时,您会有以下内容:

<some-element [class]="someExpression ? 'first' : ''">...</some-element>

总而言之,当你必须添加条件类时,ngClass会更灵活。

答案 1 :(得分:0)

根据我的经验,唯一的优势是您希望格式化数据。 例如日期,否则它是相同的:

{{'1288323623006' | date:'MM/dd/yyyy @ h:mma'}}

答案 2 :(得分:0)

*如果要添加class,请使用class,如下所示。

class="className"  

*如果要有条件地添加一个class,则可以如下使用class/ngClass in angular

[class.className]="condition"  
[ngClass]="{'className': condition}"

*如果要有条件地添加多个class,则有两种方法。

Way 1:使用class in angular如下:

[class.className1]="condition1"  
[class.className2]="condition2"
.
.
.

Way 2:使用ngClass in angular如下:

[ngClass]="{'class1': condition1 , 'class2': condition2 ... }"

很明显,第二种方法比第一种更好。 ew!