为了账号安全,请及时绑定邮箱和手机立即绑定

AngularJS ngClass有条件

AngularJS ngClass有条件

犯罪嫌疑人X 2019-08-29 09:10:02
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。
查看完整描述

3 回答

?
GCT1015

TA贡献1827条经验 获得超4个赞

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

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

这是一个plnkr

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

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

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



查看完整回答
反对 回复 2019-08-29
?
皈依舞

TA贡献1851条经验 获得超3个赞

Angular JSng-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


查看完整回答
反对 回复 2019-08-29
  • 3 回答
  • 0 关注
  • 771 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信