angular - 具有不同验证的 Angular 反应式表单按钮

Question

我正在考虑用反应形式做一个简单的形式。

我想我会遇到的问题是当我在表单上有两个按钮需要不同的验证时。

例如，Andy 向 Bobby 提交请求。然后 Bobby 通过单击批准来批准请求，或者通过单击拒绝来拒绝请求。

但是...拒绝将需要填写评论字段。在不向表单添加更多字段的情况下解决此问题的最佳方法是什么？

它还必须是动态的，需要对每个按钮进行验证的字段可能会发生变化，所以我不能只是将不同的代码烘焙到按钮上。

我希望这两个按钮都是可点击的，以便用户可以看到哪些验证得到满足或没有得到满足。

score 1 · Accepted Answer

根据我对您的问题的理解，我看到了两种可能性，这两种可能性都可以使用“反应式表单 API”来处理：

向表单动态添加控件（例如：当用户选中“拒绝”时，会出现一个新的评论字段）=> 使用 FomGroup 类的 addControl / removeControl 方法
将验证器动态添加到已经存在的控件（例如：当用户单击“拒绝”提交按钮时，评论字段变为必需）=> 使用 AbstractControl 类的 setValidators 方法

另外，不要忘记在修改控件或验证器后调用 updateValueAndValidity 方法（AbstractControl 类），否则将无法检测到更改。

1 回答 1