如何在 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 或部分标签的 formgroupname 上使用禁用或只读。我可以在组件类中的 formcontrol 名称上应用，但要求是在组级别应用禁用。

如何禁用整个组？

我正在使用 Angular 4。

原文由 shinchan 发布，翻译遵循 CC BY-SA 4.0 许可协议

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;
}

原文由 user1608841 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

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

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

而不是使用 div 你需要添加 fieldset 。有时你甚至可以这样找到：

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

但对我来说 [attr.disabled]="true" 运行良好。

原文由 Ali Eshghi 发布，翻译遵循 CC BY-SA 4.0 许可协议