AngularJS ngClass有条件

Question

AngularJS ngClass有条件是否有任何方法可以表达类似ng-class条件的东西？例如，我尝试了以下内容：<span ng-class="{test: 'obj.value1 == \'someothervalue\''}">test</span>这段代码的问题在于，无论是什么obj.value1，类测试总是应用于元素。这样做：<span ng-class="{test: obj.value2}">test</span>只要obj.value2不等于真值，该类就不适用。现在我可以通过这样做来解决第一个例子中的问题：<span ng-class="{test: checkValue1()}">test</span>当checkValue1函数如下：$scope.checkValue1 = function() {   return $scope.obj.value === 'somevalue';}我只是想知道这ng-class是否应该如何工作。我也在构建一个自定义指令，我想做类似的事情。但是，我找不到一种观察表达的方法（也许这是不可能的，也就是它的工作原理）。这是一个展示我的意思的plnkr。

Answer 1

你的第一次尝试几乎是正确的，它应该没有引号。

{test: obj.value1 == 'someothervalue'}

这是一个plnkr。

ngClass指令将适用于任何计算truthy或falsey的表达式，有点类似于Javascript表达式但有一些差异，你可以在这里阅读。如果你的条件过于复杂，那么你可以使用一个返回真或假的函数，就像你在第三次尝试时那样。

只是为了补充：你也可以使用逻辑运算符来形成逻辑表达式

ng-class="{'test': obj.value1 == 'someothervalue' || obj.value2 == 'somethingelse'}"

Answer 2

Angular JS在ng-class Directive中提供此功能。您可以在其中放置条件并分配条件类。您可以通过两种不同的方式实现此目的。

输入1

<div ng-class="{0:'one', 1:'two',2:'three'}[status]"></div>

在此代码类中将根据状态值的值应用

如果状态值为0然后应用类一个

如果状态值为1然后应用类2

如果状态值为2，则应用第3类

---

类型2

<div ng-class="{1:'test_yes', 0:'test_no'}[status]"></div>

在哪个类中将按状态值应用

如果状态值为1或true，则它将添加类test_yes

如果状态值为0或false，则它将添加类test_no