angularjs中ng-class的多个条件

Posted 2023-03-05

【中文标题】angularjs中ng-class的多个条件

【英文标题】：Multiple condition on ng-class in angularjs

【发布时间】：2020-01-17 01:30:26

【问题描述】：

如何在下面的代码中添加额外的条件

<div ng-class="true: 'complete'[item.Id != 0]"></div>

这里我需要添加"true: 'abc'[item.name == "FName"]，谁能帮帮我。

谢谢

【问题讨论】：

你想达到什么目的？这个条件是什么意思？

我只是想添加额外的条件。

true: 'abc' 不是条件... ng-class=" (item.id != 0 && /* some other condition*/) ? 'classNameWhenConditionsMet' : 'classNameWhenConditionsAreNotMet'" 是您要找的吗？

我需要根据条件添加两个不同的类

【参考方案1】：

我猜你想在这个条件下添加complete 类：item.Id != 0。正确的语法如下：

<div ng-class=" 'complete': item.Id != 0 "></div>

您可以使用逗号添加任意数量的类：

<div ng-class=" 'complete': item.Id != 0, 'abc': item.name == 'FName' "></div>

【参考方案2】：

快速搜索后发现：

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

来源：AngularJS ngClass conditional 致谢https://***.com/users/736482/bertrand

【讨论】：

我需要根据条件添加两个不同的类

所以你需要类似 if 条件：class elseif condition:class else nothing ?

不，这两个条件都应该起作用，如下图<div ng-class="true: 'complete'[item.Id != 0],true: 'abc'[item.name == "FName"]"></div>这里abc是类，但是这里第二个条件不起作用

我不知道你的情况，但我注意到你用双引号 Fname 会破坏你的代码：