我的表单中有一个mat-select,有多个选项(You can see a demo in here)。
<mat-form-field style="width: 100%">
<mat-select placeholder="Toppings" [formControl]="toppings" multiple>
<mat-option *ngFor="let topping of toppingList" [value]="topping">{{topping}}</mat-option>
</mat-select>
</mat-form-field>
它在输入字段中显示以逗号分隔的所选选项列表。有没有办法改变分隔符?
答案 0 :(得分:3)
// TODO(crisbeto): delimiter should be configurable for proper localization.
return selectedOptions.join(', ');
正如您所见,它尚未得到支持。的但强> 还有另一种方法可以实现它。
只需添加自定义mat-select-trigger
,如下所示:
<mat-select [formControl]="toppings" multiple ...>
...
<mat-select-trigger>
<span> {{toppings.value ? toppings.value.join('; ') : ''}}</span>
</mat-select-trigger>
</mat-select>
<强> Forked Demo 强>
这样您就可以选择任何分隔符,例如:
toppings.value.join('♨')