Question

我有一个带单选按钮的列表：

 <label *ngFor="let obj of RecipientType;let i = index"    class="radio-inline">
     <input formControlName="recipientType" type="radio" [value]="obj.id" name="recipientType" 
         (change)="onRecipientChange(obj.id,$event)">                       
 </label>

此列表有3个项目。如何仅禁用第三个选项？我尝试制作：[disabled] = "obj.id==3"，但我可以看到所有单选按钮都被禁用。我想要第三个。

我该怎么做？

谢谢！

Answer 1

<label *ngFor="let obj of RecipientType;let i = index"    class="radio-inline">
    <input formControlName="recipientType" type="radio" [value]="obj.id" name="recipientType" 
     (change)="onRecipientChange(obj.id,$event)" [disabled]="i===2'>                       
</label>

Answer 2

在反应形式中，通常使用的[disabled]="obj.id == 3"或[disabled]="i == 2"无效。

由于我不知道使用反应形式的解决方案，只需禁用组中的一个单选按钮。以下方法确实有效，尽管它与反应形式无关：

通过使用索引为所有单选按钮分配唯一ID，让我们使用document.getElementById。然后让我们禁用索引为2的那个。

因此，输入字段会添加id属性，使用您在迭代中声明为索引值的{{i}}：

<input id="{{i}}" formControlName="recipientType" type="radio" [value]="obj.id" name="recipientType">

，例如在生命周期挂钩AfterViewInit中，让我们禁用索引为2的输入字段：

ngAfterViewInit() {
  document.getElementById('2').disabled = true;
}

这是

如何禁用角度为2的列表中的选项？

2 个答案:

的 Plunker