角度材料选择菜单显示不正确

Question

我正在为项目使用Angular Material，正在使用选择选项，但是打开时下拉菜单的位置会混乱。

第一：

第二名：

第一个问题显示下拉列表看起来比select元素高得多。 第二个问题显示选项位于select元素上方，但这是页面的底部，因此无法看到/选择第一个选项之后的所有内容。

我使用的代码是：

<mat-form-field>
  <mat-select placeholder="Favorite food" disableOptionCentering>
    <mat-option value="Pizza">
      Pizza
    </mat-option>

    <mat-option value="Taco">
      Taco
    </mat-option>

    <mat-option value="Kebab">
      Kebab
    </mat-option>

    <mat-option value="Burgers">
      Burgers
    </mat-option>
  </mat-select>
</mat-form-field>

直接从Angular Material网站获取。 我也尝试添加“ disableOptionCentering”作为参数，以禁用选项的居中，但是它不起作用。

任何帮助表示赞赏。

谢谢

Answer 1

我确定您已经这样做了，但是请确保您已遵循本指南中的所有内容： https : //material.angular.io/guide/getting-started

您是否正确安装了@ angular / animations并记得导入BrowserAnimationsModule？

import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
@NgModule({
  ...
  imports: [BrowserAnimationsModule],
  ...
})
export class PizzaPartyAppModule { }