如何设置mat-select的面板组件的样式.从我得到的文档,我需要提供panelClass所以我这样做:
<mat-form-field>
<mat-select placeholder="Search for"
[(ngModel)]="searchClassVal"
panelClass="my-select-panel-class"
(change)="onSearchClassSelect($event)">
<mat-option *ngFor="let class of searchClasses" [value]="class.value">{{class.name}}</mat-option>
</mat-select>
</mat-form-field>
Run Code Online (Sandbox Code Playgroud)
我在开发人员工具中检查过这个类是否附加到DOM中的面板并附加了它.所以我将自定义scss类附加到此元素.现在,当我提供CSS时,它只是不起作用.我的scss例如如下所示:
.my-select-panel-class {
width:20px;
max-width:20px;
background-color: red;
font-size: 10px;
}
Run Code Online (Sandbox Code Playgroud)
面板的宽度始终等于widthselect元素的宽度.有时在选项中你有太长的字符串,我想让它更广泛.有什么方法可以做到这一点.我的组件中的风格甚至background-color无法正常工作.有人知道为什么这么奇怪吗?
我正在使用:Angular 4.4.5 @ angular/material:2.0.0-beta.12