angularjs – 在元素的ng类中可以有多个单独的三元表达式吗？

发布时间：2020-12-17 08:04:34 所属栏目：安全来源：网络整理

导读：我正在尝试将以下两个ng级三进制表达式组合成一个ng类(所以我可以通过btn-success / danger类和宽度 – 小/中/宽类来控制颜色，我的按钮divs div class="btn" ng-class="(rate 0) ? 'btn-success' : 'btn-danger'"{{rate}}/divdiv class="btn" ng-class="(pr

我正在尝试将以下两个ng级三进制表达式组合成一个ng类(所以我可以通过btn-success / danger类和宽度 – 小/中/宽类来控制颜色，我的按钮divs

<div class="btn" ng-class="(rate > 0) ? 'btn-success' : 'btn-danger'">{{rate}}</div>
<div class="btn" ng-class="(priority == 'low') ? 'width-small' : (priority == 'medium') ? 'width-medium' : 'width-wide'">{{rate}}</div>

我意识到我可以按照下面的方式做一些事情：不过，我想利用1.1.5中提供的三元表达式

<div class="btn" ng-class="{'btn-success': rate > 0,'btn-danger': rate <= 0,'width-small': priority == 'low','width-medium': priority == 'medium','width-wide': prioity == 'high'}">{{rate}}</div>

分隔表达式的空格对我来说没有效果，也没有在ng类中分隔它们的逗号

感谢您的帮助，以确定是否/如何在单个ng类中具有多个三元表达式

对于任何寻找答案的人来说：是的，这确实是可能的，同样也提到可读性是有问题的。

<div ng-class="(conversation.read ? 'read' : 'unread') + ' ' + (conversation.incoming ? 'in' : 'out')"></div>

从ngClass文档：

The directive operates in three different ways,depending on which of >three types the expression evaluates to:

If the expression evaluates to a string,the string should be one or >more space-delimited class names.

If the expression evaluates to an array,each element of the array >should >be a string that is one or more space-delimited class names.

If the expression evaluates to an object,then for each key-value pair of >the object with a truthy value the corresponding key is used as a class >name.

选项1适用于此。

从我使用这种方法的理解将导致2手表，而使用对象符号将导致4，但我可能在这一个错误。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!