Question

目前我的div看起来像这样：

<div class="class-a" [ngClass]="{'class-b': !person.something}">

现在我想要另一个条件......

所以现在我希望这个div属于class-a如果是某个类-b如果有别的东西class-c

我应该怎么做？

即时使用角度4。

谢谢！

Answer 1

将它添加为对象文字的属性：

[ngClass]="{'class-b': !person.something, 'other-condition': isOther }"

Answer 2

另一种选择是，如果您认为需要更复杂的逻辑，或者知道只有一个字符串，则从组件返回一个字符串。这可能更容易测试。

您返回的任何字符串都将呈现为类

[ngClass]="renderClass()"

renderClass() {
  switch(this.user.theme){
    case "dark":
       return "dark-theme"
    case "light":
       return "light-theme"
  }
}

Answer 3

使用此语法ngStyle的更好方法，因为，这是未完成的答案。

如果您想为text-info标签切换text-danger或<i>之类的类（

some exp ? 'text-info' : 'text-danger'

）。

最好的答案是数组而不是对象。

[ngClass] = "[some exp ? 'text-info' : 'text-danger', ...]"

好运

如何将[ngClass]用于多类条件Angular4

3 个答案: