ngClass 还是 class="{{}}"?
ngClass or class="{{}}"?
只是好奇这些方法是否有更大的优势?
<div class="small" ngClass="well-{{small}}">small</div>
或
<div class="small" class="well-{{big}}">big</div>
根据我的经验,唯一的优势是当您想要格式化数据时。
比如一个日期,否则都是一样的:
{{'1288323623006' | date:'MM/dd/yyyy @ h:mma'}}
你使用的方式ngClass
没关系。虽然,ngClass 允许我们有条件地添加 类,即
<some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>
当使用 class
时,你会得到类似这样的东西:
<some-element [class]="someExpression ? 'first' : ''">...</some-element>
总而言之,当您必须添加条件 类.
时,ngClass 更加灵活
*如果要添加 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 ... }"
很明显第二种方法比第一种好。呸!!
只是好奇这些方法是否有更大的优势?
<div class="small" ngClass="well-{{small}}">small</div>
或
<div class="small" class="well-{{big}}">big</div>
根据我的经验,唯一的优势是当您想要格式化数据时。 比如一个日期,否则都是一样的:
{{'1288323623006' | date:'MM/dd/yyyy @ h:mma'}}
你使用的方式ngClass
没关系。虽然,ngClass 允许我们有条件地添加 类,即
<some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>
当使用 class
时,你会得到类似这样的东西:
<some-element [class]="someExpression ? 'first' : ''">...</some-element>
总而言之,当您必须添加条件 类.
时,ngClass 更加灵活*如果要添加 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 ... }"
很明显第二种方法比第一种好。呸!!