angular 2/4/5材料：如何获得多选下拉列表的未选中值

1 回答

• 0

  你可以检查以下方式，

  在 component.html

  <mat-form-field>
      <mat-select placeholder="Toppings" (selectionChange)="onChange($event.value)" multiple>
          <mat-option *ngFor="let topping of toppingList" [value]="topping">{{topping}}</mat-option>
      </mat-select>
  </mat-form-field>
  

  并在 component.ts

  toppingList: string[] = ['Extra cheese', 'Mushroom', 'Onion', 'Pepperoni', 'Sausage', 'Tomato'];
  selectedList: any = []; // store selected options here
  
  onChange(event) {
  
     let missing = null;
  
     for (let i = 0; i < this.selectedList.length; i++) {
        if (event.indexOf(this.selectedList[i]) == -1) missing = this.selectedList[i];      // Current[i] isn't in prev
     }
  
      if (missing)
        alert(missing);
  
      this.selectedList = event;
  
    }
  

  这是Stackblitz演示

  回复于 2024-05-03T09:57:18+08:00