clearvalidators 不能在 Angular 6 表单控件中工作

Posted 2023-03-13

【中文标题】clearvalidators 不能在 Angular 6 表单控件中工作

【英文标题】：clearvalidators not working in angular 6 form control

【发布时间】：2019-04-06 18:08:53

【问题描述】：

我有两个表单组名称，如下所示。有时不会向用户显示一种表单。当两者都显示时，我没有问题。我有一个在表单有效时可见的按钮。

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

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

 <button
        *ngIf="InfoForm.valid"
        class="submitButton"
</button>

我使用下面的代码初始化我的表单。

this.InfoForm = this.formBuilder.group(
  personalInfo: this.getPersonalInfo(),
  familyInfo: this.getFamilyInfo(),
);

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

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

当 showFamilyInfo 为 false 时，我的 InfoForm.FamilyInfo 表单控件显示为无效。为了避免这个错误，我正在使用下面的代码清除验证器，但它仍然显示 familyInfo 表单控件状态无效。不过我的 PersonalInfo 是有效的。

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

this.InfoForm.get('familyInfo').clearValidators();
this.InfoForm.get('familyInfo').updateValueAndValidity();

【问题讨论】：

我在 Angular 6 中遇到了同样的问题。以下两个选项都不起作用 this.form.get('name').clearValidators() 和 this.form.controls['name'] .clearValidators 但暂时我已经根据我的功能应用了解决方案

【参考方案1】：

我认为您需要先清除错误，然后才能更新有效性。在链接的帖子中，Julia P. 的回答涵盖了如何清除错误。然后运行 ​​updateValueandValidity。 How can I manually set an Angular form field as invalid?