Angular 6跟进：选项值中的[attr.disabled]禁用所有条目

Question

主题：Angular 6，反应形式，下拉菜单，禁用一个选项：禁用所有功能，而不仅仅是一个预期值，即使检查员说disable = false。

人们很乐意为我解决我的问题：“ Angular 6反应形式-选择选项：禁用以前选择的选项 ”，但是当我遇到障碍时它们似乎消失了，因此我提出了新的问题：

为什么禁用所有选项值，而不是仅禁用应该与该语句匹配的选项值？ [attr.disabled]="uplink2x === dropdown1Val"（即使我禁用了硬编码，nic0而不是dropdown1Val禁用所有选项）

component.ts：

nicAdapters: any[] = ['nic0','nic1','nic2','nic3','nic4','nic5','nic6','nic7','nic8','nic9','nic10']


   this.inputForm = this.fb.group({
    upLinks: this.fb.group ({
     NumberUplinks: ['2'],
        uplinksMgmt: this.fb.group ({
            uplink1: ['nic0'],
           uplink2: ['nic1'],
           uplink3: ['nic3'],
        })
    })
  })

public changedVal(val) { 
  this.dropdown1Val = val;
}

component.html：

<div class="select" formGroupName="uplinksMgmt">
   <select formControlName="uplink1" id="uplink1Id" class="selectBox" (change)="changedVal($event.target.value)">
      <option *ngFor="let uplink1x of nicAdapters" [ngValue]="uplink1x">{{uplink1x}}</option>
   </select> 
</div>
<div class="select" formGroupName="uplinksMgmt">
   <select formControlName="uplink2" id="uplink2Id" class="selectBox" (change)="changedVal($event.target.value)">
      <option *ngFor="let uplink2x of nicAdapters" [attr.disabled]="uplink2x === dropdown1Val" [ngValue]="uplink2x">{{uplink2x}}</option>
   </select> 
</div>

编辑： Stackblitz：https : //stackblitz.com/edit/clarity-light-theme-v012-irvrup

似乎disabled="true"（或disabled="false"就此而言）不适用于选项值。

行为截图

Answer 1

要禁用元素，只需使用attribute disabled而不是true或false即可。要再次启用它，您需要删除该disabled属性。在代码[attr.disabled]中将值设置为true或false时，您只需要使用[disabled]而不是即可[attr.disabled]。

  <option>Test FALSE</option>
  <option disabled>Test TRUE</option>

  <option *ngFor="let dropDownTestx of adapters" 
      [ngValue]="dropDownTestx" 
      [disabled]="dropDownTestx === 'vmnic2'">
      {{dropDownTestx}}
  </option>

在此处更新了堆叠闪电战。