用AngularJS比较表单验证中的两个输入值

Question

<p>
    Email:<input type="email" name="email1" ng-model="emailReg">
    Repeat Email:<input type="email" name="email2" ng-model="emailReg2">
<p>

<span ng-show="registerForm.email1.$error.required">Required!</span>
<span ng-show="registerForm.email1.$error.email">Not valid email!</span>
<span ng-show="emailReg !== emailReg2">Emails have to match!</span>  <-- see this line

我想有一个没有自定义指令的解决方案，但如果这不能实现没有它，我会处理它。下面是一个用自定义指令解决类似问题的答案。

感谢您的帮助，谢谢

Answer 1

实现这一点的一种方法是使用自定义指令。下面是一个使用自定义指令（在本例中是ng-match)的示例：

<p>Email:<input type="email" name="email1" ng-model="emailReg">
Repeat Email:<input type="email" name="email2" ng-model="emailReg2" ng-match="emailReg"></p>

<span data-ng-show="myForm.emailReg2.$error.match">Emails have to match!</span>

注意：通常不建议使用ng-作为自定义指令的前缀，因为它可能与正式的AngularJS指令冲突。

也可以在不使用自定义指令的情况下获得此功能：

<button ng-click="add()></button>
<span ng-show="IsMatch">Emails have to match!</span>

$scope.add = function() {
  if ($scope.emailReg != $scope.emailReg2) {
    $scope.IsMatch=true;
    return false;
  }
  $scope.IsMatch=false;
}