Question

我希望每当有一个选择选项时，都将其添加到列表的末尾，而不是将其作为顺序...

您可以检查材料的堆叠闪电： https://stackblitz.com/angular/jdgkdlbeldj?file=src%2Fapp%2Fselect-multiple-example.ts

如果我有此列表：

toppingList: string[] = ['Extra cheese', 'Mushroom', 'Onion', 'Pepperoni', 'Sausage', 'Tomato'];

我最初选择的是蘑菇和意大利辣香肠-> MyList = [Mushroom, Pepperoni].

如果我添加一个新选项，例如Onion，我希望MyList为： [Mushroom, Pepperoni, Onion]，但我的名字是[Mushroom, Onion, Pepperoni]。

我该怎么办？

Answer 1

角材料select提供sortComparator输入属性。它将接受比较器功能以对所选值进行排序。

component.html

<mat-form-field>
  <mat-label>Toppings</mat-label>
  <mat-select [sortComparator]="sortComparator" [formControl]="toppings" multiple>
    <mat-option *ngFor="let topping of toppingList" [value]="topping">{{topping}}</mat-option>
  </mat-select>
</mat-form-field>

component.ts

sortComparator(a:any, b:any){
    return 1;
  }

Example

Answer 2

代替手动使用表单绑定检查GetConnection()事件何时触发，然后将新选择与保存的选择进行比较。如果在列表中未选择新的选定元素，则在缺少新项的情况下将其推入列表。

selectionChange

有没有办法在列表末尾添加材料选择选项？

2 个答案: