javascript - 如何在 Angular Reactive Forms 中做 required-if？

Question

我有一个 react 形式并基于属性 fooRequired我想将该字段设置为是否必填。
我无法更改它，因为它是在初始时设置的。那我该怎么办？

fooRequired = false;

form = new FormGroup({
 foo: new FormControl(null, [Validators.required])
});

toggle() { this.fooRequired = !this.fooRequired; }

Answer 1

以下将解决问题:

toggle() {
  this.fooRequired = !this.fooRequired;
  this.form.controls.foo.setValidators(this.fooRequired ? null : [Validators.required]);
  this.form.controls.foo.updateValueAndValidity();
}

这里，基于fooRequired bool 值，设置或删除验证器。最后，更新了新的表单控件设置。