AngularJS Benutzerdefiniertes Eingabesteuerelement führt keine Überprüfung durch

Question

Ich habe ein benutzerdefiniertes Eingabesteuerelement erstellt und versucht, eine bestimmte Überprüfung auf Unschärfe durchzuführen. Aber es funktioniert nicht wie erwartet. Ich möchte wie unten Vorlage verwenden, anstatt jquery spezifischen element.bind der Verwendung (‚Blur‘)

template: '<input type="text" ng-blur="performvalidation()">', 

Complete fiddle here

Bitte führen oder korrigieren, was mache ich falsch. Vielen Dank.

Answer 1

Wenn Sie benutzerdefinierte Validatoren erstellen möchten, sollten Sie sie dem $ validators-Feld des ngModelControllers hinzufügen. z.B.

angular.module('app').directive('strongSecret', function() { 
    return { 
    restrict: 'A', 
    require: 'ngModel', 
    link: function(scope, element, attr, ctrl) { 
     ctrl.$validators.uppercaseValidator = function(value) { 
     return /[A-Z]/.test(value); 
     } 

     ctrl.$validators.numberValidator = function(value) { 
     return /[0-9]/.test(value); 
     } 

     ctrl.$validators.sixCharactersValidator = function(value) { 
     return value.length === 6; 
     } 
    } 
    }; 
}); 

auch statt Ihrer Richtlinie eine Vorlage geben Sie sollten es nur auf ein Element Eingang verwenden

<input ng-model="strongSecret" strong-secret name="strongSecret"/> 

wenn Sie wollen die Fehler nicht zeigen, bis der Benutzer aus dem Eingabefeld klickt weg Sie konnten dieses

<ul ng-if="sampleForm.strongSecret.$touched" class="error-msgs" ng-messages="sampleForm.strongSecret.$error"> 
... 
</ul> 

Arbeits jsFiddle tun: https://jsfiddle.net/e81kee9z/2/