问题描述
看来< mat-autocomplete> 的宽度始终是我们输入的输入的宽度.没有办法使它变大吗?我的输入量很小，无法读取下拉菜单项.我的表单空间也受到限制，因此无法增大输入范围.
It seems like the <mat-autocomplete> width is always the width of the input we're typing in. Is there no way to make it larger? I have a very small input and can't read the dropdown items. I'm also limited in form space so can't make the input larger.
<mat-form-field style="width: 100px;">
<input matInput [matAutocomplete]="auto">
<mat-autocomplete style="width: 500px;" #auto="matAutocomplete">
<mat-option *ngFor="let item of items" [value]="item">
</mat-option>
</mat-autocomplete>
</mat-form-field>
推荐答案
在MatAutocomplete 完全满足您的需求:
指定自动完成面板的宽度.可以是任何CSS大小值，否则将与其主机的宽度匹配.
Specify the width of the autocomplete panel. Can be any CSS sizing value, otherwise it will match the width of its host.
使用此属性，您不会有被cdk-overlay-pane继承的任何其他事物干扰的风险.
By using this property you are not in the risk of meddling with anything else inherited from cdk-overlay-pane.
对于进一步的自定义，您可能会发现此属性也很有用:
For further customization you might find this property useful as well:
采用在主机mat-autocomplete元素上设置的类，并将其应用于覆盖容器内的面板，以简化样式.
Takes classes set on the host mat-autocomplete element and applies them to the panel inside the overlay container to allow for easy styling.
这篇关于更改垫子自动完成宽度?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！