在使用$验证管道AngularJS密码匹配会产生意想不到的效果 [英] Password matching in AngularJS using the $validators pipeline produces unexpected results

问题描述

查看例子 rel=\"nofollow\">。

See the example here.

使用$验证管道，我想检查一个字段包含相同的值作为另一个领域。

Using the $validators pipeline, I am trying to check that a field contains the same value as another field.

在本实施例中的每个输入与其它相关联，以使得预期的结果如下：

Each input in this example is associated with the other, such that the expected result is as follows:

• 输入输入＃1
的值

• 在输入＃输入相同的值，2


• 这两个领域现在应该是有效


• ALTER输入＃1
价值

• 输入＃1应为无效（或输入2或两者）

最初，我这样做使用 $观看在两个当前模型和目标为等于，所以只用该指令所需要的两个场中的一个。然而，在引入 $验证管道，这种方法意外停止工作（可能是错误）。

Initially, I did this using a $watch on both the current model and the target to be equal to, so only one of the two fields needed to use the directive. However, with the introduction of the $validators pipeline, this method stopped working unexpectedly (maybe a bug).

总之，你可以看到，当第二输入被改变，则该值为收到相关的输入未定义。

Anyhow, as you can see, when the second input is altered, the value is receives for the associated input is undefined.

我解决了这个由以下内容：

I solved this by the following:

的jsfiddle

正如尼科斯所述，两个实例分别相互抵消，因此，这是由以下code固定

As Nikos said, the two instances were cancelling each other out, so this was fixed by the following code:

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

所以，现在，当目标输入的变化，目前的输入重新验证。当电流输入的变化，它会自动验证（像往常一样）。

So now, when the target input changes, the current input revalidates. When the current input changes, it validates automatically (as usual).

推荐答案

的一个问题是，当一个验证失败（返回假），那么底层模型值设置到未定义。所以：

One problem is that when a validator fails (returns false), then the underlying model value is set to undefined. So:

1. 您键入密码什么的，说AAA;这是的不的一样 passwordConfirm ，所以验证器返回假和模型得到在未定义值


2. 您键入passwordConfirm相同的值;但是从密码的值以上未定义和未定义！==AAA，所以passwordConfirm验证回报假了。


3. 等等...

1. You type something in the password, say "aaa"; this is NOT the same as passwordConfirm, so the validator returns false and the model gets the undefined value
2. You type the same value in passwordConfirm; but from above the value of the password is undefined and undefined !== "aaa", so the passwordConfirm validator returns false too.
3. And so on...

这篇关于在使用$验证管道AngularJS密码匹配会产生意想不到的效果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！