Question

在Angular 2.1.0 Reactive表单中，我有一个使用formBuilder组函数的表单，它试图使用模式验证器来验证其中一个字段。

this.profileForm = this.formBuilder.group({
'email': [this.profile.email, [
            Validators.pattern('^[a-z0-9A-Z_]+(\.[_a-z0-9A-Z]+)*@[a-z0-9-A-Z]+(\.[a-z0-9-A-Z]+)*(\.[a-zA-Z]{2,15})$')
        ]],
//...

正如你所看到的，我已经在组上手动添加了大写的A-Z，但我想知道是否有办法指定模式验证器来忽略大小写。我似乎无法在线找到任何示例，而且我可以告诉您无法传递实际的RegExp对象，它必须是一个字符串。

Answer 1

在最近的Angular版本中，这些修复了这个问题，Validators.pattern函数现在接受了RegExp对象。

对于这个版本，我只是创建了一个自定义验证类，并添加了我自己的模式函数，它接受一个RegExp对象。看起来像这样：

import { AbstractControl, ValidatorFn } from '@angular/forms';
export class CustomValidators {

    public static pattern(reg: RegExp) : ValidatorFn {
        return (control: AbstractControl): { [key: string]: any } => {
            var value = <string>control.value;
            return value.match(reg) ? null : { 'pattern': { value } };
        }
    }
}

引用此验证器的表单如下所示：

    this.profileForm = this.formBuilder.group({
        'firstName': [{ value: this.profile.firstName, disabled: true }],

        //... other fields

        'email': [this.profile.email, [
            CustomValidators.pattern(/^[a-z0-9_]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,15})$/ig)
        ]],

        //...other fields

    });

Angular 2反应形式模式验证器;无视案例

1 个答案: