有条件地在Angular 4的Reactive表单内的单选按钮组中禁用单选按钮 [英] Disable a radio button conditionally in a radio button group inside Reactive form in Angular 4

问题描述

我在组件中创建了一个反应式表单，并在其上定义了一些 formControls .

I have a reactive form created in component and some formControls defined on it.

现在，我需要根据某些条件从单选按钮组中禁用一个单选按钮.

Now i need to disable one of the radio button from a radio button group based on some condition.

在创建 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不鼓励这样做

Now how to disable one of them conditionally? when using [disable] attribute i get some warning in browser console. Angular doesn't encourage doing it

推荐答案

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

Ignore the browser warning and use the disabled attribute on the input. If you'd like you can use :

[attr.disabled]="whatever"

相反，它应该使警告静音.Angular反应性表单当前不支持根据以下未解决的问题通过formcontrol/formgroup API禁用组中的单个单选按钮:

instead which should silence the warning. Angular reactive forms do not currently support disabling individual radio buttons in a group through the formcontrol / formgroup API as per this open issue:

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

这篇关于有条件地在Angular 4的Reactive表单内的单选按钮组中禁用单选按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！