Validez que 2 champs de forme angulaire n'ont pas le même contenu

Question

J'ai une forme angulaire composée de deux champs emplacement A et emplacement B. Ce que j'aimerais obtenir est une directive qui compare les deux champs et valide en conséquence, style le champ valide ou invalide de manière appropriée chaque fois que les champs ont le même emplacement.

J'ai essayé d'insérer la logique à l'aide ng-change = validateLocations(), mais en fonction de ce que j'ai fait des recherches, une directive serait mieux adaptée à des scénarios tel est le dessus.Procédé même logique pourrait également être appliquée à la validation from et to dates sur un DatePicker comme bien.

J'ai essayé quelque chose comme ceci:

.directive("locationANotEqual", function() { 

     return { 

      restrict: "A", 
      require: "ngModel", 
      link: function (scope, element, attr, ctrl) { 

       ctrl.$validators.locationNotEqual= function (modelvalue) { 
        if (modelvalue !== scope.form.locationB) { 
         return true; 

        } else { 

         return false 
        } 
       } 
} 
} 
}); 

je mets l'attribut sur le champ de saisie locationA à cet égard. Ce que je voudrais, c'est pouvoir incorporer des contrôles pour les deux champs dans une seule directive plutôt que 2.

Answer 1

Ajoutez un autre paramètre à votre directive et comparez-le à cette valeur au lieu de scope.form.locationB. Appelez attributes.$observe sur cette valeur pour les modifications afin que le modèle de la directive peut être marqué valide/invalide.

data-ng-model-options="{allowInvalid: true}" est utilisé de sorte que lorsque les valeurs correspondent, le modèle est toujours défini.

app.directive('validateNotEqual', [ 
    function() { 
     return { 
      restrict: 'AE', 
      require: '^ngModel', 
      link: function(scope, element, attributes, ngModelCtrl) { 
       if (!ngModelCtrl) { 
        return; 
       } 

       var errorKey = 'notEqual'; 

       ngModelCtrl.$validators[errorKey] = function(value) { 
        return value !== attributes.validateNotEqual; 
       }; 

       attributes.$observe('validateNotEqual', function(value) { 
        ngModelCtrl.$setValidity(
         errorKey, 
         value !== ngModelCtrl.$modelValue); 
       }); 
      } 
     }; 
    } 
]); 

Voir plunker.