Question

我有一个可选的电子邮件字段但是如果有值应该匹配电子邮件模式？

如果表单有很多可选字段，如网站，电话等，该怎么办？

顺便说一下，使用FormBuilder，FormGroup，Validators形成@ angular / forms

Answer 1

前：

contactForm:FormGroup = new FormGroup({});

ngOnInit() {
const validateEmail = "[a-zA-Z0-9._\-]+[@]+[a-zA-Z0-9\-]+[.]+[a-zA-Z]{2,6}";
this.contactForm.addControl("email", new FormControl('', Validators.pattern(validateEmail));
}

这样您可以创建可选字段，但是当您有需要验证的数据时

编辑：将 - 添加到允许的字符

Answer 2

通过创建optionalValidator来解决这个问题：

import { ValidatorFn, AbstractControl, Validators } from '@angular/forms';

export function optionalValidator(validators?: (ValidatorFn | null | undefined)[]): ValidatorFn {
    return (control: AbstractControl): { [key: string]: any } => {

        return control.value ? Validators.compose(validators)(control) : null;
    };
}

以我的反应形式：

this.form = this._fb.group({
      email: [this.contact.email, [optionalValidator([Validators.maxLength(255), Validators.email])]]
    });

如何验证角度2中的可选字段？

2 个答案: