angular - 带有反应形式的角度4表单验证不起作用

Question

我是 Angular v4 的新手。我必须对表单进行验证。表单结构是有两个复选框，如果我选择第一个复选框，然后该表单的多个字段可以使用验证进行编辑，并且取消选中这些字段会禁用，第二个复选框也适用于相同的行为。这是页面的快照

如果单击一般信息复选框，则左侧的所有字段都应可通过验证进行编辑，如果取消选中则禁用所有字段，并且与地址复选框相同，如果它检查所有字段应可通过验证进行编辑并且取消选中使其禁用。

谢谢..

Answer 1

为一般信息和地址创建两个表格。

generalInfoForm = fb.group( (
   'name' : [null, Validators.required],
   'age'  : [null, Validators.required] .... )) ;

addressForm = fb.group( (
   'house_no' : [null, Validators.required],
   'LandMark'  : [null, Validators.required] )) ;

然后还要确保上述复选框的结果有两个布尔变量。

然后，您可以使用角度绑定来禁用或不禁用表单。

---

left div

姓名 ：<input type="text" .... [disabled]="! general_Info_Selected" />

年龄 ：<input type="text" .... [disabled]="! general_Info_Selected" />

right div

房屋编号：<input type="number" .. [disabled]="! address_Selected" />

地标：<input type="text" .... [disabled]="! address_Selected" />