gpt4 book ai didi

css - 如何调整mat-option的位置

转载 作者:行者123 更新时间:2023-11-28 19:12:17 24 4
gpt4 key购买 nike

我正在运行 Angular 应用程序,我有自动完成字段,我想调整它的位置。我引用了官方文档enter link description here在方法下,更新位置 -更新自动完成建议面板的位置,以确保它适合视口(viewport)中的所有选项。

我不知道怎么用

这是我的模板.html

 <mat-form-field [style.cursor]="pointer" [style.cursor]="pointer" [style.width.px]=300  >
<input class="selectCustomer" class="selectCustomerData" id="inputCustomer" matInput [matAutocomplete]="auto" [formControl]="customerFilterControl" [(ngModel)]="customerName">
<mat-icon matSuffix>keyboard_arrow_down</mat-icon>
<p id="spandiv">{{customerName}}</p>
<mat-autocomplete dropdown-arrow="true" panelWidth ="450px" #auto="matAutocomplete" [displayWith] = "displayFn">
<mat-option class="CustomerDropDown" *ngFor="let customer of filteredOptions | async" [value] ="customer.AccountID +' '+'('+ customer.AccountName + ')'" (onSelectionChange)="onCustomerChange(customer)">
{{customer.AccountID}} ({{customer.AccountName}}) <p id="spandiv1">{{customer.AccountID}} ({{customer.AccountName}})</p>
</mat-option>
</mat-autocomplete>
</mat-form-field>

如下图所示,我希望 mat-option 向左移动一点

enter image description here

如图所示,突出显示的类总是将样式应用到 left:779px 但我想保持 atv 775px

enter image description here

最佳答案

我可以使用


.mat-autocomplete-panel {
position:relative;
right:3px;
}

关于css - 如何调整mat-option的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59071911/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com