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 表单字段设置为无效?
| 归档时间: |
|
| 查看次数: |
1510 次 |
| 最近记录: |