javascript - Angular JS | Angular 验证匹配密码

Question

我正在尝试使用 https://github.com/TheSharpieOne/angular-validation-match 中的 Angular 验证匹配.我无法获得匹配项以触发任何类型的表单验证。现在即使密码不同也不会显示密码不匹配。这可能是什么原因？以下是 html。

  <form name="vm.changeForm"
        ng-submit="vm.changeForm.$valid && vm.attemptChange(password);"
        >
    <md-input-container class="md-block">
      <input required
             type="password"
             placeholder="New Password"
             name="passwordName"
             ng-model="password"
             />
      <div ng-messages="vm.changeForm.passwordConfirm.$error"
           ng-if="vm.changeForm.passwordConfirm.$touched"
           role="alert"
           >
        <div ng-message="required">Please enter a password.</div>
      </div>
    </md-input-container>
    <md-input-container class="md-block">
      <input required
             type="password"
             placeholder="Confirm New Password"
             name="myConfirmField"
             ng-model="passwordConfirm"
             match="password"
             />

      <div ng-show="vm.changeForm.passwordConfirm.$error.match"
           ng-if="vm.changeForm.passwordConfirm.$touched"
           role="alert">Passwords do not match</div>


    </md-input-container>
  </form>

Answer 1

注意事项:

1. 你在同一个 div 上使用 ng-if 和 ng-show，这不是必需的，你可以简单地进入一个简单的 ng-if.

2. 您必须使用 name 属性而不是 ng-model。

因此，由于您的input 名称是myConfirmField，您必须替换它:

<div ng-show="vm.changeForm.passwordConfirm.$error.match" ng-if="vm.changeForm.passwordConfirm.$touched" role="alert">Passwords do not match</div>

对于:

<div ng-if="vm.changeForm.myConfirmField.$touched && vm.changeForm.myConfirmField.$error.match" role="alert">Passwords do not match</div>

那么你应该得到预期的结果。