Angular 我可以有 2 个 ng-pattern 来验证同一个字段吗

Question

我当前的输入是这样的

<input type="email" name="email"
    ng-pattern="emailRegex"
    ng-change="emailChanged()"
    required />

我的 ng-pattern="ctrl.emailRegex" 验证电子邮件是否有效

/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{1,63}$/;

但我想阻止 info@、admin@、help@、sales@ 电子邮件，所以我将正则表达式更改为

/^(?!(?:info|admin|help|sales)@)[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{1,63}$/

到目前为止一切顺利，但我想展示一下

Invalid email

到"invalid@!!!!!.com!"

和

info@, admin@, help@, sales@ emails are not allowed

到info@test.com

如何在同一个输入中有 2 个 ng-pattern？

谢谢

Answer 1

您只能验证一种输入模式。而且，即使您可以通过使用指令以某种方式做到这一点，这种解决方案也太肮脏了。 而不是，我建议在 ng-change 的函数内根据正则表达式验证输入，并使用 formName.inputName.$setValidity 设置输入的自定义有效性。如果通过了一种模式，这可以让你有后备。

所以，例如，ctrl.emailChanged 可能有这样的东西，

ctrl.emailChanged = function() {
  var emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{1,63}$/;
  var customValidateEmail = /^(?!(?:info|admin|help|sales)@)[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{1,63}$/;

  if(!emailPattern.test(ctrl.registrationForm.email)) {
    // Invalid email
  } else if (customValidateEmail.test(ctrl.registrationForm.email)) {
    // handle accordingly
  }

  // rest of the things
  ...

}

或者，您可以将验证逻辑移至另一个函数并从 emailChanged.

中调用它

Angular 我可以有 2 个 ng-pattern 来验证同一个字段吗

Angular can I have 2 ng-pattern to validate the same filed

angularjs

ng-pattern