Validieren Passwort Felder Winkel auf eingereicht oder schmutzig

Question

Ich habe unter Controller und Formular erstellt und mehrere Validierungsregeln implementiert. aber ich kann nicht scheinen, den besten Weg zu finden, um sicherzustellen, dass die confirm_password ist gleich password?

html

<div class="col-md-5" ng-controller="RegisterController as vm"> 
    <form id="sign_up" name="SignUp" ng-submit="vm.register(SignUp)" novalidate> 
     <div class="box_form"> 
      <div class="form-group"> 
       <label>Email</label> 
       <input type="email" class="form-control" name="email" ng-model="vm.email" placeholder="Din email" required> 
       <p ng-show="(SignUp.email.$error.email || SignUp.email.$error.required) && (SignUp.terms.$dirty || vm.submitted)" class="help-block ng-binding" 
        style="">Email er invalid.</p> 
      </div> 
      <div class="form-group"> 
       <label>Brugernavn</label> 
       <input type="text" class="form-control" name="username" ng-model="vm.username" ng-minlength="3" ng-maxlength="14" placeholder="Dit brugernavn" 
        required> 
       <p ng-show="SignUp.username.$error. && (SignUp.username.$dirty || vm.submitted)" class="help-block ng-binding" style="">Brugernavn er invalid.</p> 
      </div> 
      <div class="form-group"> 
       <label>Adgangskode</label> 
       <input type="password" class="form-control" name="password" ng-model="vm.password" ng-minlength="6" ng-maxlength="24" placeholder="Din adgangskode" 
        required> 
       <p ng-show="SignUp.password.$error && (SignUp.password.$dirty || vm.submitted)" class="help-block ng-binding" style="">Adgangskode er invalid.</p> 
      </div> 
      <div class="form-group"> 
       <label>Adgangskode bekræftelse</label> 
       <input type="password" class="form-control" name="confirm_password" ng-model="vm.confirm_password" ng-minlength="6" ng-maxlength="24" 
        ng-model="vm.confirm_password" placeholder="Bekræft din adgangskode" required> 
       <p ng-show="(SignUp.confirm_password.$dirty || vm.submitted)" class="help-block ng-binding">Adgangskoderne er ikke ens.</p> 
      </div> 
      <div class="checkbox-holder text-left"> 
       <div class="checkbox_2"> 
        <input type="checkbox" value="accept" id="check_2" name="terms" ng-model="terms" required> 
        <label for="check_2"> 
         <span>I Agree to the 
          <strong>Terms &amp; Conditions</strong> 
         </span> 
        </label> 
       </div> 
      </div> 
      <!-- validation --> 
      <p class="alert alert-danger text-center" ng-show="SignUp.terms.$error.required && (SignUp.terms.$dirty || vm.submitted)">Accepter vilkår og betingelser.</p> 

      <div class="form-group text-center add_top_30"> 
       <button class="btn_1" id="sign_up_btn" type="submit">Opret</button> 
      </div> 
     </div> 

    </form> 
</div> 

Controller

(function() { 
    'use strict'; 

    angular 
    .module('KryptoApp') 
    .controller('RegisterController', RegisterController); 
    RegisterController.$inject = ['$location', '$scope', 'Authentication']; 

    function RegisterController($location, $scope, Authentication) { 
    var vm = this; 

    vm.register = register; 

    function register(form) { 
     vm.submitted = true; 
     if(form.$valid) { 
     Authentication.register(vm.email, vm.password, vm.confirm_password, vm.username); 
     } 
    } 


    } 

})(); 

Answer 1

Ich denke, Sie eine Richtlinie für diesen Fall schaffen sollte:

var compareTo = function() { 
return { 
    require: "ngModel", 
    scope: { 
     otherModelValue: "=compareTo" 
    }, 
    link: function(scope, element, attributes, ngModel) { 

     ngModel.$validators.compareTo = function(modelValue) { 
      return modelValue == scope.otherModelValue; 
     }; 

     scope.$watch("otherModelValue", function() { 
      ngModel.$validate(); 
     }); 
    } 
};}; 

module.directive ("compareTo", vergleicheT O);

und dann in Ihrem html:

<input type="password" name="confirmPassword" 
    ng-model="registration.user.confirmPassword" 
    required 
    compare-to="registration.user.password" /> 

<div ng-messages="registrationForm.confirmPassword.$error" 
    ng-messages-include="messages.html"></div>