如何使用角度js中的$ scope变量将类分配给元素

Question

我有一个班级

.haba-haba{
border:1px solid red;
height:50%;
width:50%;
}

我使用

将类名存储在我的控制器的范围变量中

$scope.className = "haba-haba";

如何将$scope.className作为班级分配给div？

我试过<div ng-class="'{{className:true}}'"></div>它没有用。

任何人都可以告诉我一个解决方案吗？提前谢谢！

Answer 1

ngClass指令的语法是：

ng-class="{'haba-haba': thruthValue}"

，其中

$scope.thruthValue = true;

您显然可以将true替换为false或返回true或false的函数。

另一种用法是：

ng-class="getTheClass()"

，其中

$scope.getTheClass = function() {
    return 'haba-haba';
}

Here's a working fiddle of the second usage.

另外，正如其他人所指出的那样，第二种用法完全违背了理智的MVC。 除非你知道自己在做什么，否则不要使用它。

Answer 2

实际上，你应该对ng-class做的是创建一个布尔变量并将其附加到ng-class属性 - 当这个布尔值为true时 - div有该类：

$scope.toggleClass = false;

ng-class="{'haba-haba' : toggleClass}"

现在，当您将toggleClass设置为true时，您的div会添加haba-haba。