Question

我正在使用 FormGroup ， FormBuilder 和 Validators 类来验证Angular2应用中的表单。

这就是我为电子邮件和密码验证定义所需验证规则的方法： -

export class LoginComponent implements OnInit {
    loginFormGroup:FormGroup;
    adminLoginmodel = new Admin('', '', '', 'Emailsss','Passwordsss');  

    constructor(
       private route: ActivatedRoute,
       private router: Router,
       private _adminLogin: AdminLoginService,
       fb: FormBuilder
    ){
         this.loginFormGroup = fb.group({
            'email' : [null, Validators.required],
            'password': [null, Validators.required]
         });
    }
}

如何验证给定字符串是否是有效的电子邮件？

注意：

有人刚刚尝试将此问题标记为此question的副本。

我的问题专门询问 FormGroup 和 FormBuilder 的实现，甚至在问题的开头都说明了这一点。这是一个很好的例子，可以说明一些好的和有效的问题是如何得到不公平的判断的。希望版主和其他所谓的＃stack; stackoverflow-community-builders＆＃34;没有编辑此问题以删除此部分。

Answer 1

this.loginFormGroup = fb.group({
  'email' : [null, Validators.compose([Validators.required, Validators.email])],
  'password': [null, Validators.required]
});

将多个验证器组合成一个函数，该函数返回各个错误映射的并集。

Answer 2

你必须使用带有正则表达式的模式验证器：

this.loginFormGroup = fb.group({
    'email' : [null, Validators.pattern('^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$')],
    'password': [null, Validators.required]
});

如何在Angular2中验证电子邮件？

2 个答案: