コントローラには、次のような関数があります。
AngularJS:
$scope.toggleClass = function(class){
$scope.class = !$scope.class;
}
切り替えたいクラスの名前を渡すことで、一般的なものにしたい:
<div class="myClass">stuff</div>
<div ng-click="toggleClass(myClass)"></div>
しかし、myClass
がangular関数に渡されていません。これをどのように機能させることができますか?上記のコードは、次のように記述した場合に機能します。
$scope.toggleClass = function(){
$scope.myClass = !$scope.myClass;
}
しかし、これは明らかに一般的ではありません。 myClass
という名前のクラスにハードコーディングしたくありません。
関数内
$scope.toggleClass = function(class){
$scope.class = !$scope.class;
}
$scope.class
は、パラメータclass
とは何の関係もありません。これは、文字通りclass
と呼ばれる$scope
のプロパティです。変数class
によって$scope
のプロパティidentifiedにアクセスする場合は、配列スタイルのアクセサーを使用する必要があります。
$scope.toggleClass = function(class){
$scope[class] = !$scope[class];
}
これはAngular固有ではありません。これはJavaScriptの動作方法です。次の例を見てください。
> var obj = { a: 1, b: 2 }
> var a = 'b'
> obj.a
1
> obj[a] // the same as saying: obj['b']
2
また、コード
<div ng-click="toggleClass(myClass)"></div>
スコープに変数があると仮定します。 $scope.myClass
は、アクセスするプロパティの名前を持つ文字列に評価されます。 文字通り文字列myClass
を渡したい場合は、
<div ng-click="toggleClass('myClass')"></div>
この例では、あなたが探しているものが明確にされていません(myClass
という名前のクラスがdiv
にあるため)。