How to prevent the value selected across multiple select in ng-select

Question

I am having two drops downs which gets data from same array.If i select an option in the first dropdown then the value should not be available in the second drop down and vice versa also.

I am using ng-select but i could see anything related to my problem. I have found the link where they are using it in angular js with filter option but how could the same can be done in ng-select

I have tried to disable the option in ng-select like below but if the user selects another option how can i enable the previously disabled value.

change(data) {
  const items = this.hardwareIds.slice();
  this.hardwareIds.forEach((hardwareId) => {
    if (hardwareId.id === data.id) {
      hardwareId.disabled =  true;
    }
  });
  this.hardwareIds = [];
  this.hardwareIds = [...items];
}

DropDown

         <ng-select
            #sourceSelect
            [items]="hardwareIds"
            [selectOnTab]="true"
            [clearable]="false"
            bindValue="id"
            bindLabel="hardware_id"
            labelForId="source_switch_id"
            placeholder="Select source switch id"
            formControlName="source_switch_id"
            (change)="change($event)"
          >
          </ng-select>

          <ng-select
            #destinationSelect
            [items]="hardwareIds"
            [selectOnTab]="true"
            [clearable]="false"
            bindValue="id"
            bindLabel="hardware_id"
            labelForId="dest_switch_id"
            placeholder="Select destination switch id"
            formControlName="dest_switch_id"
            (change)="change($event)"
          >
          </ng-select>

Answer 1

just create two variables, "source" and "dest", and after create the form, subscribe to form.valueChanges to filter the values. I use the merge rxjs operator, you can has two subscribe, one for this.form.get('dest_switch_id').valueChanges and another one for this.form.get('source_switch_id').valueChanges

  hardwareIds = [
    { id: 1, hardware_id: "uno" },
    { id: 2, hardware_id: "dos" },
    { id: 3, hardware_id: "tres" },
    { id: 4, hardware_id: "cuatro" },
    { id: 5, hardware_id: "cinco" }
  ];

  form=new FormGroup({
    source_switch_id:new FormControl(),
    dest_switch_id:new FormControl(),

  })
  //you create two variables "source" and "dest"
  source = this.hardwareIds;
  dest = this.hardwareIds;

  ngOnInit() {
    merge(
      this.form.get('dest_switch_id').valueChanges,
      this.form.get('source_switch_id').valueChanges
    ).subscribe(()=>{

      this.source = this.hardwareIds.filter(x => x.id != this.form.get('dest_switch_id').value);
      this.dest = this.hardwareIds.filter(x => x.id != this.form.get('source_switch_id').value);
    })
  }
  }

In a select

See the stackblitz