Comment puis-je utiliser le filtre AngularJS dans ngClass?

Je suis curretly apprentissage AngularJS et de jouer avec le tutoriel.

Je suis modifiant le tutoriel exemple filtre pour retourner une chaîne de caractères:

angular.module('phonecatFilters', []).filter('checkmark', function() {
  return function(input) {
    return input ? 'true-class' : 'false-class';
  };
});

Et j'aimerais l'utiliser dans ngClass comme suit:

{{phone.trueVal  | checkmark}} <i ng-class="{{phone.trueVal  | checkmark }}"></i>
{{phone.falseVal | checkmark}} <i ng-class="{{phone.falseVal | checkmark }}"></i>

Les résultats:

true-class <i class="false-class">
false-class <i class="false-class">

Maintenant.. alors que pour un simple point de vue le filtre fonctionne comme prévu.. pourquoi n'est-il pas de travail pour ngClass? Ce devait être la bonne façon d'utiliser une valeur filtrée dans ngClass (et d'autres comme ngSrc etc).

source d'informationauteur loostro

  1. 23

    Dans votre cas, vous devez utiliser class au lieu de ng-class parce que vous rendre le nom de la classe directement sur le code html sans évaluation.

    <div ng-controller="MyCtrl">
   <i class="{{phone.trueVal  | checkmark }}">{{phone.trueVal  | checkmark}}</i>
   <i class="{{phone.falseVal | checkmark }}">{{phone.falseVal | checkmark}}</i>
</div>

    DÉMO

  2. 13

    Cela a fonctionné pour moi. Juste regardé avec AngularJS donc je ne sais pas si la fonctionnalité a été ajoutée dans le cadre d'une mise à jour depuis que cette question est un couple d'années.

    ng-class="{ 'has-error': (login.form | validField:'username') }"

    Après l'ajout de parenthèses, il a travaillé.