Question

我有一个需要和电子邮件验证的登录表单。如果这些验证中的任何一个失败，则会显示错误消息，并将错误类应用于该字段。

这些是按预期应用的。当用户登录时，如果凭据失败，我想手动添加验证错误。这会使表单无效，并显示我的消息“无法识别电子邮件/密码组合”，但错误类不适用于该字段 - 即使（loginForm。$ submitted＆amp;＆amp;！loginForm.email。$ valid））评估为真。

我在这里缺少什么？

JS：

login() {
  if (!this.$scope.loginForm.$valid) {
    return;
  }

  this.authenticationService
    .login(this.email, this.password)
    .success((response) => {
      //success code...
    })
    .error((response) => {
      if (response.error === 'invalid_grant') {
        this.$timeout(() => {
          this.$scope.$apply(() => {
            this.$scope.loginForm.email.$setValidity('invalidGrant', false);
          });
        });
      }
    });
}

HTML：

<form name="loginForm" ng-submit="loginController.login()" novalidate>
    <input type="email" class="form-control" id="email" name="email" placeholder="Email" ng-model="loginController.email" required=""
        ng-class="{error:loginForm.$submitted && !loginForm.email.$valid}" />
    <div ng-show="loginForm.$submitted">
        <span ng-show="loginForm.email.$error.required">Email field is required.</span>
        <span ng-show="loginForm.email.$error.email">Email field is not valid.</span>
        <span ng-show="loginForm.email.$error.invalidGrant">Email/password combination is not recognised.</span>
    </div>
<!-- other fields... -->
<button type="submit">Sign In</button>
</form>

使用setValidation（）时未应用ng-class

0 个答案: