Question

我正在尝试使用ng-class向此div添加两个类，但即使checkForActive正在返回true，它也会被忽略，只会添加class_{{$index}}

如果我完全删除class_{{$index}}，则会正确添加active。

我的语法中有明显的错误吗？

<div "ng-class="{active: checkForActive, disabled: checkForDisable, class_{{$index}}} "></div>

Answer 1

您只需向键true提供class_{{$index}}值，只需将该属性作为类名添加到元素的类列表中即可。这就是你active: checkForActive的方式。

即

{active: checkForActive, disabled: checkForDisable, class_{{$index}} :true}

但我相信由于在ng-class指令中使用插值（{{）会导致一些不良行为（Atleast曾经发生在旧版本中）。所以你也可以使用数组。

ng-class="[checkForActive && 'active' , checkForDisable && 'disabled', 'class_' + $index]"

如果活动或禁用为false，上面的方法将添加一个类名false，这应该是无害的。

或者将索引传递给控制器函数说getStatus($index)并从那里返回对象并在ng-Class指令中使用它。

 $scope.getClass = function(){
     var obj = {active: $scope.checkForActive, disabled: $scope.checkForDisable}; 
     obj['class_' + this.$index] = true;
     return obj;
 }

和

 ng-class="getClass()"

@Okazari指出，确实可以将class与ng-class混合起来，所以你也可以这样做：

class="class_{{$index}}" ng-class="{active: checkForActive, disabled: checkForDisable}"

难以在类中添加多个类

1 个答案: