Question

由于某种原因，md菜单似乎总是出现在触发元素的左侧。

有关示例，请参阅this plnkr。

<button md-button [mdMenuTriggerFor]="appMenu" style="width: 300px">
   BUTTON
</button>

<md-menu #appMenu="mdMenu">
  <button md-menu-item> Settings </button>
  <button md-menu-item> Help </button>
</md-menu>

有没有办法控制它？

我希望菜单显示在按钮的中间，或点击的位置。

非常感谢！

Answer 1

md-menu仅为before提供了位置after和positionX。因此，没有记录的移动菜单面板的方法。

作为一种解决方法，如果你知道触发元素的位置，你可以添加一些css覆盖来移动菜单面板。

以下是一个例子：

的CSS：

>>> .cdk-overlay-pane {
      left: 100px !important;
    }

Plunker demo

Angular Material 2 md菜单位置

1 个答案: