AngularJS password negotiation using the $ validators pipeline yields unexpected results

Question

See an example here .

Using the $ validators pipeline, I'm trying to verify that a field contains the same value as another field.

Each input in this example is associated with a different one, so the expected result is as follows:

• Enter the value at input # 1
• Enter the same value in input # 2
• Both fields must be valid.
• Change the value at input # 1
• input # 1 must be invalid (or input # 2 or both)

At first I did this using $watch for both the current model and the target to be equal, so only one of the two fields should have used the directive. However, with the introduction of the $validators this method unexpectedly stopped working (possibly an error).

In any case, as you can see, when the second input changes, the value for the corresponding input is undefined .

Decision

I solved it as follows:

Jsfiddle

As Nikos said, the two instances canceled each other, so this was fixed with the following code:

 $scope.$watch('passwordWatch', function(pass) { $control.$validate(); }); 

So now, when the target input changes, the current input is checked again. When the current input changes, it is automatically checked (as usual).

Answer 1

One of the problems is that when the validator fails (returns false ), the value of the base model is set to undefined . So:

• Enter the password in your password, say "aaa" ; it is NOT the same as passwordConfirm , so the validator returns false and the model gets undefined
• You enter the same value in passwordConfirm; but above the password values ​​are undefined and undefined !== "aaa" , so passwordConfirm authentication also returns false .
• And so on...