如何在DIV标签上应用禁用属性，该属性是Angular 4中的formGroupName

Question

代码段：

<div formGroupName="address" [disabled] = "isDisabled">
<label class="accordion-header">Address:</label>
  <input type="radio" name="address" value="true" formControlName="address" [checked]="settingsForm.controls.address.controls.booleanAddress.value === 'true'">Inherit
  <input type="radio" name="address" value="false" formControlName="address" [checked]="settingsForm.controls.adddress.controls.booleanAddress.value === 'false'">Override

我无法在DIV或部分标签上使用禁用或读取。我可以在组件类中以FormControl名称申请，但要求是在组级别上应用禁用。

如何禁用整个组？

我正在使用Angular4。

Answer 1

没有办法禁用div；但是，您可以使用CSS pointer-events:none

对此进行模拟

您可以喜欢以下：

<div formGroupName="address" [ngClass]="{'disableDiv': isDisabled}">
<label class="accordion-header">Address:</label>
  <input type="radio" name="address" value="true" formControlName="address" [checked]="settingsForm.controls.address.controls.booleanAddress.value === 'true'">Inherit
  <input type="radio" name="address" value="false" formControlName="address" [checked]="settingsForm.controls.adddress.controls.booleanAddress.value === 'false'">Override

和scss：

.disableDiv{
    pointer-events:none;
}

Answer 2

这是我禁用所有元素的方式：

<fieldset  [attr.disabled]="true">
</fieldset >

而不是使用Div，您需要添加fieldset。有时您甚至可以找到这样的东西：

<fieldset ng-disabled="true"> 
</fieldset >

但对我而言，[attr.disabled]="true"效果很好。

Answer 3

您不能在不编写某种自定义指令的情况下。readonly均不是disabled属性在html中对div标签有效。