web-dev-qa-db-ja.com

ngClassが機能しませんか？

私はAngularJSが初めてであり、ngClassディレクティブを使用して次のような要素にクラスを動的に挿入できることを理解しています：

<input ng-class="{some-class: condition, another-class: anotherCondition}">

そしてangularは、どの条件が真であるかを自動的に評価し、それらの特定のクラスを要素に挿入します。

今、私は次のようなことをしようとしています：

<div class="form-group" ng-class="{has-success: form.email.$valid}">

私はブートストラップを持っているので、電子メールが有効な場合、ラベルと入力を自動的に緑色に色付けします。しかし、それは機能せず、コンソールでこの特定のエラーが発生しています：

Error: [$parse:syntax] http://errors.angularjs.org/1.2.27/$parse/syntax?p0=-&p1=is%20unexpected%2C%20expecting%20%5B%3A%5D&p2=5&p3=%7Bhas-success%3A%20form.email.%24valid%7D&p4=-success%3A%20form.email.%24valid%7D
z/<@http://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:6:450

等々....

私は何を間違えていますか？構文の問題ですか？

javascriptangularjstwitter-bootstrap
22
Rohan

クラス名にダッシュがあるので、一重引用符を使用してください！

ng-class="{'has-success': form.email.$valid}"
37
tymeJV

これは明らかにパーサーエラーです。プロパティ名@ -に{has-success: form.email.$valid}が存在するため、無効な構文があります。それらを引用符で囲む必要があります。

試してください：-

<div class="form-group" ng-class="{'has-success': form.email.$valid}">
13
PSL

これは私のために働いた

[ngClass] = "{ 'color-red': isRed}"
0
Zohab Ali