Problems with password matching with Angular Auto Validate

Question

Trying to integrate Angular Auto Validate's password matching/confirmation example into a form. I'm not getting any errors but the password matching code is not kicking in. What's the simplest way to fix this? What am I doing wrong?

Here's a plunkr of my code

Here's the password matching code I'm trying to integrate:

function ConfirmPasswordValidatorDirective(defaultErrorMessageResolver) {
  defaultErrorMessageResolver.getErrorMessages().then(function (errorMessages) {
      errorMessages['confirmPassword'] = 'Please ensure the passwords match.';
    });

    return {
        restrict : 'A',
        require : 'ngModel',
        scope : {
            confirmPassword : '=confirmPassword'
        },
        link : function(scope, element, attributes, ngModel) {
            ngModel.$validators.confirmPassword = function(modelValue) {
                return modelValue === scope.confirmPassword;
            };

            scope.$watch('confirmPassword', function() {
                ngModel.$validate();
            });
        }
    };
}

ConfirmPasswordValidatorDirective.$inject = [
  'defaultErrorMessageResolver'
];

Here's a plunkr of angular-auto-validate's password matching code working.

There are a lot of posts / ready directives to do this, look this for example: http://stackoverflow.com/questions/14012239/password-check-directive-in-angularjs — developer033, Jul 13 '16 at 23:33
Thank you, I don't feel that addresses the specific issues in the above post using Angular Auto Validate. — Agent Zebra, Jul 13 '16 at 23:36
True, I didn't notice you're using a module since you didn't put it specifically. — developer033, Jul 13 '16 at 23:38

score 1 · Accepted Answer · answered Jul 13 '16 at 23:53

1

Well, at first you forgot to call the directive in your view, so you should include it in your confirmPassword <input>:

confirm-password="formModel.password"

Also you haven't declared the directive in your JS file:

app.directive('confirmPassword', ConfirmPasswordValidatorDirective);

Look: DEMO

answered Jul 13 '16 at 23:53

developer033

24,267
8
82
108

Thank you fantastic. Ah " see, `scope : { confirmPassword : '=confirmPassword' },` was not reflected in the confirmPassword `` Just one question so I can understand: why did you remove `class="control-label"` on the password labels? – Agent Zebra Jul 14 '16 at 00:07
Hmm, maybe, I copied the fields of their plnkr :), but you can just do these modifications above on **your** plnkr and it will works. – developer033 Jul 14 '16 at 00:09

Problems with password matching with Angular Auto Validate

1 Answers1