角度/材质6菜单仅在左上角打开

Cli*_*ith 6 angular-material angular

我已经升级到angular@6.0.2,angular/material@6.0.2,cli@6.0.3我的工作应用程序都有菜单现在左上角,而不是绑在触发打开.我运行了默认cli安装并将其添加到app.component.html

<button mat-fab color="primary"  [matMenuTriggerFor]="menu">Menu</button>
<mat-menu class="myMenu" #menu="matMenu">
  <button mat-menu-item>Item 1</button>
  <button mat-menu-item>Item 2</button>
</mat-menu>
Run Code Online (Sandbox Code Playgroud)

MatMenuModule是进口的.我能够移动打开菜单的唯一方法是通过这个css可怕的kludge.

.myMenu {
    position: absolute;
    top: calc(figure out using nnvh - nnpx);
    left: calc(figure out using nnvw - nnpx);
}
Run Code Online (Sandbox Code Playgroud)

唯一的问题是菜单的位置 - 所有这一切都很好@5.x.x.现在我的工作应用程序显得破碎

小智 2

确保还使用material/prebuilt-themes目录中提供的最新材质CSS文件,因为现在似乎需要以下类才能使菜单正常工作:

.cdk-overlay-connected-position-bounding-box {
position: absolute;
z-index: 1000;
display: flex;
flex-direction: column;
min-width: 1px;
min-height: 1px;}
Run Code Online (Sandbox Code Playgroud)