html - 垫选择下拉选项未对齐

Question

我对 Angular 很陌生，并且正在使用 mat-select 模块创建一个下拉菜单。虽然我能够创建下拉菜单，但 mat-options 不在下拉选择器下方居中。选择器位于页面顶部，选项显示在页面的最底部。这是我的代码：

  <mat-form-field appearance="fill">
            <mat-select [(ngModel)]="sortType" (ngModelChange)="applyFilter()">
              <mat-option value="likelihood">Match Likelihood</mat-option>
              <mat-option value="distance">Distance</mat-option>
            </mat-select>
        
  </mat-form-field>

这篇文章描述了一个类似的问题，我已经尝试了建议的解决方案。也没有应用额外的 CSS 样式。有没有办法让选项直接显示在下拉列表下方？

标签： htmlcssangular

Answer 1

这是一般行为。如果有足够的空间，下拉菜单中的选定选项必须与触发器对齐。disableOptionCentering您可以通过设置属性来禁用此行为。