我正在创建一个嵌套表单组,如https://plnkr.co/edit/c93yFe2r83cvjiRvl6Uj?p=preview所示.
这是来自https://angular.io/docs/ts/latest/cookbook/form-validation.html#!#reactive的示例分支
Angular中的示例显示validationMessages
在表单没有任何嵌套组时使用.当我有嵌套表单组时,我不确定如何扩展它.以下是我要创建的示例表单和验证消息.
buildForm(): void {
this.heroForm = this.fb.group({
'name': [this.hero.name, [
Validators.required,
Validators.minLength(4),
Validators.maxLength(24),
forbiddenNameValidator(/bob/i)
]
],
'address': this.fb.group({
'city': [''],
'state': ['']
}),
'alterEgo': [this.hero.alterEgo],
'power': [this.hero.power, Validators.required]
});
this.heroForm.valueChanges
.subscribe(data => this.onValueChanged(data));
this.onValueChanged(); // (re)set validation messages now
}
Run Code Online (Sandbox Code Playgroud)
预期formErrors
和validationMessages
formErrors = {
'name': '',
'power': '',
'address': {
'state': '',
'city': ''
}
};
validationMessages = {
'name': {
'required': 'Name is required.',
'minlength': 'Name must be …
Run Code Online (Sandbox Code Playgroud)