小编典典

AngularJS ngClass 条件

all

有什么方法可以表达类似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来说明我的意思。


阅读 103

收藏
2022-03-11

共1个答案

小编典典

您的第一次尝试几乎是正确的,它应该在没有引号的情况下工作。

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

这是一个plnkr

ngClass 指令适用于任何求真或假的表达式,有点类似于 Javascript
表达式,但有一些区别,您可以在此处阅读。如果您的条件太复杂,那么您可以使用返回真或假的函数,就像您在第三次尝试中所做的那样。

只是为了补充:您还可以使用逻辑运算符来形成逻辑表达式,例如

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