ngClass指令：我是否使用多个表达式来添加多个类？

Question

这里是实现

data-ng-class="{ 'tooltip_show' : showTooltip , 'tooltip__' + brand.settings.name }" 

的我想要的一个例子，但它不工作！有人可以帮忙吗？

Answer 1

使用数组形式ng-class：

<div ng-class="[showTooltip ? 'tooltip_show' : '', 
       'tooltip__' + brand.settings.name]"> 
<div> 

或计算类的JavaScript：

<div ng-class="computeClass(tooltip_show, brand.setting.name)"> 
</div> 

$scope.computeClass(show, name) { 
    var obj = {}; 
    obj.showTooltip = show; 
    obj['tooltip_'+name] = true; 
    return obj; 
}; 

后一种方法更容易调试和复杂的计算更好。

参见，

• AngularJS ng-class Directive Reference - Known Issues
• AngularJS Developer Guide - Why mixing interpolation and expressions is bad practice

Answer 2

看起来您没有为第二项设置值。你的意思是这样

{ 'tooltip_show' : showTooltip , 'tooltip__' + brand.settings.name : tooltipText } 

或

{ 'tooltip_show' : showTooltip , 'tooltip__' : brand.settings.name } 

？

Answer 3

http://jsbin.com/genaqapefe/edit?html,js,output

data-ng-class="{ 'tooltip_show': showToolTip, {{ 'tooltip_' + brand.settings.name }}: true }" 

这是在这个仓为我工作。如果没有大括号，我无法评估它，但不知道这是否是最佳做法。