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

Question

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

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

顺便说一下，我使用FormBuilder，FormGroup，Validators form @ angular / forms

Answer 1

通过创建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])]]
    });

Answer 2

例如：

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));
}

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

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