angular - 在 Angular 4 的 Reactive 表单内的单选按钮组中有条件地禁用单选按钮

Question

我在组件中创建了一个响应式(Reactive)表单，还有一些 formControls对其进行定义。

现在我需要禁用 基于某种条件的单选按钮组中的单选按钮之一。

我在创建时如何做 formControl ?

PFB 代码片段:

createForm() {
this.heroForm = this.fb.group({
  confirmActionRadioGrp: this.fb.group({
            updateAction: new FormControl({ value: '' })
        })

  });
}

在我的模板中:

    <div class="form-group confirm-action-radio-container" formGroupName="confirmActionRadioGrp">
<input  type="radio"  class="custom-control-input" value="1" formControlName="updateAction">
    <input  type="radio"  class="custom-control-input" value="2" formControlName="updateAction">
    <input  type="radio"  class="custom-control-input" value="3" formControlName="updateAction"></div>

现在如何有条件地禁用其中之一？使用时 [disable]属性我在浏览器控制台中收到一些警告。 Angular 不鼓励这样做

Answer 1

忽略浏览器警告并在输入中使用 disabled 属性。如果您愿意，可以使用:

[attr.disabled]="whatever"

相反，这应该使警告静音。根据此 Unresolved 问题，Angular 响应式(Reactive)表单目前不支持通过 formcontrol/formgroup API 禁用组中的单个单选按钮:

https://github.com/angular/angular/issues/11763