clearvalidators无法在角度6表单控件中工作

kri*_*hna 5 javascript forms typescript angular

我有两个如下所示的表单组名称。有时,一种形式没有显示给用户。当两个都显示时,我没有问题。我有一个按钮,该按钮在表单有效时可见。

 <div
        *ngIf="showPersonalInfo"
        class="personalInfo"
        formGroupName="personalInfo"
      > 

 <div
        *ngIf="showFamilyInfo"
        class="familyInfo"
        formGroupName="familyInfo"
      > 

 <button
        *ngIf="InfoForm.valid"
        class="submitButton"
</button>
Run Code Online (Sandbox Code Playgroud)

然后使用以下代码初始化表单。

this.InfoForm = this.formBuilder.group({
  personalInfo: this.getPersonalInfo(),
  familyInfo: this.getFamilyInfo(),
});
Run Code Online (Sandbox Code Playgroud)

this.getFamilyInfo()中的代码会将showFamilyInfo设置为true或false,并且在两种情况下都将初始化表单,否则找不到我的html throws familyInfo。

我们的一项服务有时会查找成员个人资料,并提取现有的家庭信息/个人信息并填充模型,并将showPersonalInfo / showFamilyInfo设置为true。

当showFamilyInfo为false时,我的InfoForm.FamilyInfo表单控件显示为无效。为避免此错误,我正在使用以下代码清除验证器,但仍显示familyInfo表单控件状态无效。我的PersonalInfo有效。

当showFamilyInfo为false时,如何忽略与FmilyInfo相关的所有内容,以便该按钮可见。

this.InfoForm.get('familyInfo').clearValidators();
this.InfoForm.get('familyInfo').updateValueAndValidity();
Run Code Online (Sandbox Code Playgroud)

小智 5

我认为您需要先清除错误,然后才能更新有效性。在链接的帖子中,Julia P. 的回答涵盖了如何清除错误。然后运行 ​​updateValueandValidity。 如何手动将 Angular 表单字段设置为无效?