如何将参数传递给ng-click功能?

Ste*_*ell 13 angularjs angularjs-ng-click

我的控制器中有一个如下所示的函数:

AngularJS:

$scope.toggleClass = function(class){
    $scope.class = !$scope.class;
}
Run Code Online (Sandbox Code Playgroud)

我希望通过传递我想要切换的类的名称来保持通用性:

<div class="myClass">stuff</div>
<div ng-click="toggleClass(myClass)"></div>
Run Code Online (Sandbox Code Playgroud)

但是myClass没有被传递给角度函数.我怎样才能让它发挥作用?如果我这样编写它,上面的代码是有效的:

$scope.toggleClass = function(){
    $scope.myClass = !$scope.myClass;
}
Run Code Online (Sandbox Code Playgroud)

但是,这显然不是一般的.我不想在名为的类中进行硬编码myClass.

Mic*_*ley 26

在功能

$scope.toggleClass = function(class){
    $scope.class = !$scope.class;
}
Run Code Online (Sandbox Code Playgroud)

$scope.class与paramter没有任何关系class.它实际上是一个$scope叫做的属性class.如果要访问由变量标识的属性$scope,则需要使用数组样式的访问器:class

$scope.toggleClass = function(class){
    $scope[class] = !$scope[class];
}
Run Code Online (Sandbox Code Playgroud)

请注意,这不是Angular特定的; 这就是JavaScript的工作原理.请看以下示例:

> var obj = { a: 1, b: 2 }
> var a = 'b'
> obj.a
  1
> obj[a] // the same as saying: obj['b']
  2
Run Code Online (Sandbox Code Playgroud)

还有,代码

<div ng-click="toggleClass(myClass)"></div>
Run Code Online (Sandbox Code Playgroud)

假设您的范围有一个变量,例如$scope.myClass,它评估为一个字符串,其中包含您要访问的属性的名称.如果你真的想要传入字符串myClass,你需要

<div ng-click="toggleClass('myClass')"></div>
Run Code Online (Sandbox Code Playgroud)

这个例子并不能说明你要找的东西(因为myClass在顶部有一个名为的类div).

  • 在javascript中,`class`不是保留的关键字吗?我很确定会在IE中破解. (4认同)