在ng-class中分配多个速记条件语句

Question

目前，我有容器，如果长度大于0，则为其提供暗类。

<div ng-class="{dark: name.length > 0}">Hi</div>

有没有办法为此添加另一个条件？所以，如果没有，可以给它一类白色。或者是一个完全不同的条件语句，给它一类白色？

Answer 1

喜欢这个吗？

<div ng-class="{'dark': name.length > 0, 'white': name.length <= 0}">Hi</div>

Answer 2

你可以使用Angular的三元运算符

<div ng-class="(name.length > 0) ? 'dark' : 'white'">Hi</div>

Answer 3

如果基于相同条件，您可以使用conditional operator（三元）

<div ng-class="name.length ? 'white' : 'dark'">Hi</div>

如果您希望每个班级都有不同的条件

<div ng-class="{'dark': name.length > 0, 'white': name.length == 5}">Hi</div>

我使用name.length == 5作为white类

的示例

Answer 4

我认为这正是您所寻找的，您可以为课程添加任意数量的条件：

 <div ng-class="{'dark': name.length > 0 || name.length !> 10 , 'light': name.length < 0}">Hi</div>