mat-select multiple设置一个数组Angular4中的选中选项

2023年12月9日 536次阅读

Angular 4.

我需要帮助来设置mat-select的选项,所以这里是问题所在：

1.首先我得到两个变量：options和checkedOptions

options: string[];
checkedOptions: string[] //This comes from the BD;

2.So选项是所有选项,checkedOptions来自BD,如下所示：

options = ["o1", "o2", "o3", "o4", ... "oN"]
checkedOptions = ["o2", "o4"]

3.我打印这样的选项：

<mat-form-field floatPlaceholder="always" color="accent" class="input-all">
  <mat-select multiple placeholder="{{ par.label }}">
    <mat-option *ngFor="let op of options" [value]="op">{{ op }}</mat-option>
  </mat-select>
</mat-form-field>

>所以在mat-select中是所有选项……但我想要的是,在选项列表中,只需检查哪些是在checkedOptions列表中.我怎么做？

请帮忙.

最佳答案 在这种情况下,您必须在mat-select-tag中使用ngModel并将其绑定到您的选择列表.这是解决方案：

HTML

<mat-form-field floatPlaceholder="always" color="accent" class="input-all">

   <mat-select [(ngModel)]="checkedOptions" multiple placeholder="{{ par.label }}">

       <mat-option *ngFor="let op of options" [value]="op">{{ op }}</mat-option>

   </mat-select>

</mat-form-field>
点赞