Отключить выбранный вариант одного раскрывающегося списка для всех остальных раскрывающихся списков

Question

У меня есть несколько раскрывающихся списков, которые содержат одинаковые значения массива, я хочу отключить параметр, который выбирается в одном раскрывающемся списке для других раскрывающихся списков, так как мне этого добиться?

 <div>
    <div>
      <label >Name</label>
    </div>
    <div >
      <select >
        <option value="">Select</option>
        <option *ngFor="let type of Demo">{{type}}</option>
      </select>
    </div>
  </div>

 <div>
    <div>
      <label >Number</label>
    </div>
    <div >
      <select >
        <option value="">Select</option>
        <option *ngFor="let type of Demo">{{type}}</option>
      </select>
    </div>
  </div>

.ts File
Demo = ['One', 'Two','Three']

Answer 1

Попробуйте это

<div>
  <div>
    <label >Name</label>
  </div>
  <div >
    <select [(ngModel)]="selectedValues[0]">
      <option value="">Select</option>
      <option *ngFor="let type of Demo" [ngValue]="type" [disabled]="isDisabled(type)">{{type}}</option>
    </select>
  </div>
</div>

<div>
  <div>
    <label >Number</label>
  </div>
  <div >
    <select [(ngModel)]="selectedValues[1]">
      <option value="">Select</option>
      <option *ngFor="let type of Demo" [ngValue]="type" [disabled]="isDisabled(type)">{{type}}</option>
    </select>
  </div>
</div>

Demo = ['One', 'Two', 'Three']
  selectedValues = [];
  isDisabled(value) {
    return this.selectedValues.includes(value);
  }

Если у вас есть 20 выпадающих, поместите html-код в * ngFor и привяжите метку, значение к его.