我正在构建一个表单,用户可以在其中设置付款选项。有一个下拉菜单可以选择使用哪种付款方式。
对于每种付款方式,都有一个 FormGroup
,其中包含所选方法的选项:
form: FormGroup = new FormGroup({
method: new FormControl('paypal', {
validators: [
Validators.required,
],
}),
paypal: new FormGroup({
email: new FormControl(null, {
validators: [
Validators.required,
Validators.pattern(EMAIL_PATTERN)
],
}),
}),
other: new FormGroup({
email: new FormControl(null, {
validators: [
Validators.required,
Validators.pattern(EMAIL_PATTERN)
],
}),
}),
});
这里的问题是,只有当 FormGroups
都有效时,表单才有效。
但是只要所选付款方式的 FormGroup
有效,表单就应该有效。
最佳答案
我建议编写一个自定义的根级 FromGroup
验证器。您基本上有一个定制的验证要求,它需要一个定制的验证器。
验证器可以在整个 FormGroups
以及单个 FormControls
上工作,因为它们都是 AbstractControls在幕后。
This should point you in the right direction
编辑:对于任何寻求快速答案的人来说,这里有一个 stackblitz:nested form validation
关于Angular 7 Forms - 有条件地需要 FormGroup,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54036613/