我在Angular 5应用程序中使用此角度材质选择:
<mat-form-field style="width:88%;">
<mat-select placeholder="Contact *" formControlName="contact">
<mat-option *ngFor="let contact of contacts" [value]="contact">
<mat-icon [ngStyle]="{'color': contact.color}">home</mat-icon>{{contact.institution}}
</mat-option>
</mat-select>
</mat-form-field>
在选择面板上 <mat-icon>
列出了预期,但是如果我选择一个选项而不是 home 列在 <mat-form-field>
我现在的问题是如何在 <mat-form-field>
中查看主页图标
2 回答
这可以通过“mat-select-trigger”选项完成 . 有关“mat-select”的文档可以在这里找到 .
https://material.angular.io/components/select/api#MatSelectTrigger
下面应该是您正在尝试做的工作示例 . 根据您提供的内容 .
并根据需要应用样式 .
您可以在表单字段中添加matPrefix:
如果图标是每个联系人的属性,例如
contact.icon
,那么您需要做更多的工作来将当前选定的联系人的图标属性绑定到mat-icon名称: