Question

我遇到一个问题，即在我的单选按钮上设置或清除特定验证器的点击事件是在值实际更改之前这样做的。

如果单击是单选按钮，我想切换其显示的附加字段的验证器。如果没有，我想清除它隐藏的附加字段的验证器。它通过* ngIf正确显示和隐藏字段，但验证器方法在值更改之前执行。因此，第一次未定义值时，每次在显示更改前的值之后。

以下示例。模板片段。

<input type="radio" formControlName="infraRadio" [value]="1" (click)="radioSetValidator(changeForm.get('changeAssessmentFG.infraRadio'),[changeForm.get('changeAssessmentFG.newInfrastructure')])">Yes
<input type="radio" formControlName="infraRadio" [value]="0" (click)="radioSetValidator(changeForm.get('changeAssessmentFG.infraRadio'),[changeForm.get('changeAssessmentFG.newInfrastructure')])">No


<textarea class="form-control" rows="2" formControlName="newInfrastructure" style="width:100%"
*ngIf="changeForm.get('changeAssessmentFG.infraRadio').value=='1'"> </textarea>

组件类中的方法：

radioSetValidator(c: FormControl, d: [FormControl]) {
if (+c.value === 1) {
  d.forEach(element => {
    element.setValidators(Validators.required);
  });

} else {
  d.forEach(element => {
    element.clearValidators();
  });
}

}

我仍然试图将整个角度包裹起来，所以这里的答案可能很明显。我在尝试进行研究时看到的这种行为的几乎所有其他例子似乎都涉及ngModel和onModelChange，但这似乎并不适用于我或工作。有人可以帮我辨别出需要改变的工作吗？

Answer 1

您可以使用(change)事件绑定而不是点击。

其他可能性是将值作为另一个参数传递给函数：

<input type="radio" formControlName="infraRadio" [value]="1" (click)="radioSetValidator(1, changeForm.get('changeAssessmentFG.infraRadio'),[changeForm.get('changeAssessmentFG.newInfrastructure')])">Yes
<input type="radio" formControlName="infraRadio" [value]="0" (click)="radioSetValidator(0, changeForm.get('changeAssessmentFG.infraRadio'),[changeForm.get('changeAssessmentFG.newInfrastructure')])">No

radioSetValidator(value: number, c: FormControl, d: [FormControl]) {
  if (value === 1) {
    d.forEach(element => {
      element.setValidators(Validators.required);
    });

  } else {
    d.forEach(element => {
      element.clearValidators();
    });
  }
}

在单击事件执行之前更新单选按钮值

1 个答案: