Question

我试图在* ngClass中添加多个值，过去曾在以前的alpha版本中使用过什么，而且现在似乎无法在angular2 beta上运行：

<i *ngClass="['fa','fa-star']"></i>

产生错误：

EXCEPTION：TypeError：无法读取属性＆＃39;添加＆＃39;未定义的 PostView @ 30:27中[[＆＃39; fa＆＃39;，＆＃39; fa-star＆＃39;]]

我在这里缺少什么？

Answer 1

您应该使用方括号来创建属性绑定。见this plunk

<i [ngClass]="['fa','fa-star']"></i>

Answer 2

如果您不打算动态更改这些类，那么使用ngClass是过度的。您只需在模板中使用class="fa fa-star"即可。

当你想要动态打开和关闭它们时，应该使用

ngClass。文档中有一个例子：

您的组件将有一个方法：

setClasses() {
  return {
    saveable: this.canSave,      // true
    modified: !this.isUnchanged, // false
    special: this.isSpecial,     // true
  }
}

然后在模板中使用ngClass，如下所示：

<div [ngClass]="setClasses()">This div is saveable and special</div>

Answer 3

您还可以构建包含多个类的字符串。

在这种情况下， additionalClass 是包含类名的@Input var， active 是设置活动类的布尔值

<div [ngClass]="(additionalClass + ' ' + (active ? 'active' : ''))"></div>

ngClass

3 个答案: