Validierung funktioniert nicht für Passwort und bestätigt das Passwort

Question

Bin neu bei angularjs. Ich versuche Formular Validierung zu machen, die username, email, password und confirm password beinhaltet, aber wenn ich alle Felder richtig ausfülle, ist der submit button immer noch deaktiviert. Kann mir jemand helfen.

<div ng-app="myapp"> 
    <form name="myForm"> 
    <label for="email">Email</label> 
    <input type="email" id="email" name="email" ng-model="formData.email" required/> 
    <span ng-show="myForm.email.$error.required && myForm.email.$dirty">required</span> 
    <span ng-show="!myForm.email.$error.required && myForm.email.$error.email && myForm.email.$dirty">invalid email</span> 
     <br /> 
    <label for="email">Name</label> 
    <input type="text" id="name" name="name" ng-model="formData.name" required/> 
    <span ng-show="myForm.name.$error.required && myForm.name.$dirty">required</span> 
     <br /> 
     <label for="username">Username</label> 
     <input type="text" id="username" name="username" ng-model="formData.username" ng-minlength="5" ng-maxlength="20" ng-pattern="/^[A-z][A-z0-9]*$/" required /> 
    <span ng-show="myForm.username.$error.required && myForm.username.$dirty">required</span> 
    <span ng-show="!myForm.username.$error.minLength && !myForm.username.$error.maxLength && myForm.username.$error.pattern && myForm.username.$dirty">Must start with a letter, and contain letters &amp; numbers only.</span> 
    <span ng-show="!myForm.username.$error.required && (myForm.username.$error.minlength || myForm.username.$error.maxlength) && myForm.username.$dirty">Username ust be between 5 and 20 characters.</span> 
     <br /> 


     <label for="password">Password</label> 
     <input type="password" id="password" name="password" ng-model="formData.password" ng-minlength="8" ng-maxlength="20" required /> 
    <span ng-show="myForm.password.$error.required && myForm.password.$dirty">required</span> 
    <span ng-show="!myForm.password.$error.required && (myForm.password.$error.minlength || myForm.password.$error.maxlength) && myForm.password.$dirty">Passwords must be between 8 and 20 characters.</span> 

     <br /> 


     <label for="password_c">Confirm Password</label> 
     <input type="password" id="password_c" name="password_c" ng-model="formData.password_c" valid-password-c required /> 
    <span ng-show="myForm.password_c.$error.required && myForm.password_c.$dirty">Please confirm your password.</span> 
    <span ng-show="!myForm.password_c.$error.required && myForm.password_c.$error.noMatch && myForm.password.$dirty">Passwords do not match.</span> 
     <br /> 

    <button type="submit" class="btn" ng-disabled="!myForm.$valid">Submit</button> 
    </form> 
    </div> 

<script> 
var app = angular.module('myapp', ['UserValidation']); 

angular.module('UserValidation', []).directive('validPasswordC', function() { 
    return { 
     require: 'ngModel', 
     link: function (scope, elm, attrs, ctrl) { 
      ctrl.$parsers.unshift(function (viewValue, $scope) { 
       var noMatch = viewValue != scope.myForm.password.$viewValue 
       ctrl.$setValidity('noMatch', !noMatch) 
      }) 
     } 
    } 
}) 
</script> 

Answer 1

Hoffe, das hilft. Sie sollten noMatch zurückgeben.

<script> 
var app = angular.module('myapp', ['UserValidation']); 

angular.module('UserValidation', []).directive('validPasswordC', function() { 
return { 
    require: 'ngModel', 
    link: function (scope, elm, attrs, ctrl) { 
     ctrl.$parsers.unshift(function (viewValue, $scope) { 
      var noMatch = viewValue != scope.myForm.password.$viewValue 
      ctrl.$setValidity('noMatch', !noMatch); 
      return (noMatch)?noMatch:!noMatch; 
     }) 
    } 
    } 
}) 
</script>