So legen Sie die Gültigkeit in der Direktive fest (angularjs)

Question

Gibt es eine Möglichkeit, eine Eingabegültigkeit innerhalb einer Direktive festzulegen? Die Eingabe, die in der Vorlage der Richtlinie vorhanden ist.

Lets sagen, ich habe Vorlage:

<input type="text" ng-model="someObj.val" ng-change="check()"> 

Und meine Direktive ist wie:

.directive('myDir', function() { 
     return { 
     restrict: 'E', 
     templateUrl: 'trmplate.html', 
     link: function (scope) { 

      someObj = {val: '123'}; 

      scope.check = function() { 
      var result = false; 
      myInput.$setValidity(result); //this is didn't work, $setValidity not a function 
      }; 

     } 
     } 
    }) 

ich bin, kann es nicht mit Form wickeln, denn die Idee dahinter ist, Benutzer zu ermöglichen, umfasst Diese Eingabe in das Formular des Benutzers.

Answer 1

Sie müssen NgModelController Instanz abzurufen mit dem Eingang verbunden. Dann rufen Sie $setValidity für dieses Objekt auf und geben den Validierungsschlüssel an (erforderlich, minlength, customkey, etc.). Es wird wie folgt aussehen:

.directive('myDir', function() { 
    return { 
    restrict: 'E', 
    template: '<input type="text" ng-model="someObj.val" ng-change="check()">', 
    link: function(scope, element) { 

     var modelController = element.find('input').controller('ngModel'); 

     someObj = { 
     val: '123' 
     }; 

     scope.check = function() { 
     var result = false; 
     modelController.$setValidity('myrequired', result); 
     }; 

    } 
    } 
}) 

Der wichtigste Teil ist hier, wie NgModelController zu bekommen. Im Folgenden Codezeile kümmert es:

var modelController = element.find('input').controller('ngModel'); 

Answer 2

Ich sehe nicht myInput zu nichts zugewiesen, deshalb ist $ setValidity keine Funktion. Außerdem befindet sich SomeObj nicht auf dem Bereich, und ich vermute, Sie falsch geschrieben "Vorlage". Ich würde so etwas wie dies empfehlen:

.directive('myDir',() => { 
    return { 
    restrict: 'E', 
    templateUrl: 'template.html', 
    link: (scope, element) => { 

     scope.someObj = {val: 123}; 

     scope.check =() => { 
     let result = false; 
     element.find('input').val().$setValidity(result); //this is didn't work, $setValidity not a function 
     }; 

    } 
    } 
}) 

Answer 3

Sie brauchen nicht Elem zu verwenden, um die Steuerung zu erhalten, fügen Sie ihn einfach als param auf die Link-Funktion und Satz erfordern [ 'ngModel '], um das Modell ctrl zu bekommen.

require: ['ngModel'], 
link: function (scope, elem, attrs, ctrl) { 

     someObj = {val: '123'}; 

     scope.check = function() { 
     var result = false; 
     ctrl.$setValidity(result); 
     }; 

    }