1

我创建了一个自定义验证器来检查用户填写的电子邮件地址。无论如何，电子邮件字段不是必需的，但如果我添加我的验证器，它也包括在内required。

这是我constructor的组件类中的表单：

    this.myForm = fb.group({
        'name': [''],
        'surname': [''],
        'username': ['', Validators.required],
        'email': ['', validateEmail]
    });

电子邮件字段不是必需的，但如果用户不填写它，则表单不会得到验证。同时，如果用户填写它，我希望应用电子邮件验证。

这是我的电子邮件验证器：

export function validateEmail(c: FormControl) {
    var EMAIL_REGEXP = /^(|(([A-Za-z0-9]+_+)|([A-Za-z0-9]+\-+)|([A-Za-z0-9]+\.+)|([A-Za-z0-9]+\++))*[A-Za-z0-9]+@((\w+\-+)|(\w+\.))*\w{1,63}\.[a-zA-Z]{2,6})*$/i;

    return EMAIL_REGEXP.test(c.value) ? null : {
        validateEmail: {
            valid: false
        }
    };
}

我可以编辑我的自定义验证器以接受空字符串，但我认为这不是解决我的问题的正确方法。

你有更好的主意吗？

4

2 回答 2

0

我创建了一个带有参数的自定义验证器。所以它可以用来检查有效的电子邮件，甚至可以检查所需的有效电子邮件。它仍然是可重用的，甚至可以不需要，如果你用trueor调用它false。

这是代码：

import {FormControl} from "@angular/forms";

export const validateEmail = (canBeEmpty:boolean) => {
    return (control:FormControl) => {
        var EMAIL_REGEXP = /^(|(([A-Za-z0-9]+_+)|([A-Za-z0-9]+\-+)|([A-Za-z0-9]+\.+)|([A-Za-z0-9]+\++))*[A-Za-z0-9]+@((\w+\-+)|(\w+\.))*\w{1,63}\.[a-zA-Z]{2,6})*$/i;

        if (canBeEmpty) {
            EMAIL_REGEXP = /^$|^(|(([A-Za-z0-9]+_+)|([A-Za-z0-9]+\-+)|([A-Za-z0-9]+\.+)|([A-Za-z0-9]+\++))*[A-Za-z0-9]+@((\w+\-+)|(\w+\.))*\w{1,63}\.[a-zA-Z]{2,6})*$/i;
        }

        return EMAIL_REGEXP.test(control.value) ? null : {
            validateEmail: {
                valid: false
            }
        };
    };
}
于 2016-12-12T08:30:57.117 回答
0

控制值允许使用空字符串，如下所示：

static emailValidator(control: any) {
  // RFC 2822 compliant regex
  var EMAIL_REGXP = /[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/;

  if ( control.value === '' || control.value.match(EMAIL_REGXP) ) {
    return null;
  } else {
    return { 'invalidEmailAddress': true };
  }
};

我认为这不会被视为副作用，因为该函数的目的是查找应符合电子邮件格式的无效字符串。

于 2017-03-29T22:18:40.640 回答