ngClass pas de travail?

Je suis nouveau sur AngularJS et je comprends que le ngClass directive peut être utilisé pour insérer des classes dynamiquement dans des éléments comme:

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

Et angulaire sera automatiquement évaluer les conditions sont remplies et s'insérer l'un de ces classes dans l'élément.

Maintenant, je suis en train de faire quelque chose comme:

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

Depuis que j'ai bootstrap, il sera automatiquement la couleur de l'étiquette et de l'entrée en vert si l'email est valide. Mais il ne fonctionne pas et j'obtiens cette erreur dans la console:

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

et ainsi de suite....

Ce que je fais mal? Est-ce un problème de syntaxe?

InformationsquelleAutor Rohan | 2015-01-15
  1. 37

    Il y a un tiret dans le nom du cours, afin d'utiliser les guillemets simples!

    ng-class="{'has-success': form.email.$valid}"
    • Quel timing.. Nos réponses sont posté exactement en même temps.. 17-21-21, vous avez été millisecondes devant moi.. 😀
    • Bah...je sais que vous êtes toujours sur ces Angulaire des questions, faut être rapide!
    • C'est exactement ce que je pensais. Maintenant que dois-je accepter? Et plus le upvote la guerre est également à proximité.
    • Attendez, pourquoi ne peut-il pas être l'inverse? Je veux dire, ng-class='{"has-success": form.email.$valid}'
    InformationsquelleAutor tymeJV
  2. 13

    C'est clairement une erreur de l'analyseur, vous avez syntaxe non valide en raison de la présence de - dans le nom de la propriété @ {has-success: form.email.$valid}. Vous auriez besoin de les envelopper dans des guillemets.

    Essayer:-

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

    Cela a fonctionné pour moi

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