Несколько классов в ngClass

Я пытаюсь добавить несколько значений в *ngClass, что раньше работало на предыдущих Альфа-релизах и, похоже, не работает сейчас на Angular2 beta:

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

Он выдает ошибку:

исключение: TypeError: не удается прочитать свойство "добавить" неопределенного в [['fa',' fa-star'] PostView@30:27]

что я пропустила?

3 ответов


для создания привязки свойств следует использовать квадратные скобки. См.этот бухнуть

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

если вы не собираетесь динамически изменять эти классы, используйте 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>

вы также можете создать строку, содержащую несколько классов.

в этом случае additionalClass - это @Input var, содержащий имя класса и активный - логическое значение, задающее активный класс

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