【问题标题】：External ui-grid-menu-button?外部ui-grid-menu-button？
【发布时间】：2015-11-13 10:14:24
【问题描述】：

以下网址还有另一个堆栈溢出问题，但它恰好是一年前的零答案：

基本上我需要找到一种方法将 ui-grid-menu-button 与表格的右上角分开并将其放置在其他位置。我似乎找不到任何关于此的文档，我正在寻找任何解决方法或黑客解决方案。

【问题讨论】：

标签： javascript css angularjs angular-ui-grid

【解决方案1】：

这就是我解决这个问题的方法。

隐藏原按钮的css

我在 cmets 中写下了每一行的目的。我必须隐藏原始按钮，因为菜单会自动在该按钮下方打开并且我希望菜单位于右上角，所以我必须重置按钮的高度（请参阅我的最终结果）。如果您不希望它位于表格的左上角或右上角，则打开的网格菜单的位置可能会出现问题。

.ui-grid-menu-button {
    border: none;               // hide button
    background: transparent;    // hide button
}
.ui-grid-menu-button .ui-grid-icon-container {
    visibility: hidden;         // hide button
    height: 0;                  // menu in top-right corner
    margin-top: 0;              // menu in top-right corner
}

我的自定义按钮的 HTML

<div
    ng-if="myUiGridOptions.enableGridMenu"
    ng-click="gridApi.grid.gridMenuScope.toggleMenu()">
    <!-- menu icon -->
</div>

gridApi对象是ui-grid的api，可以这样获取

myUiGridOptions.onRegisterApi = function (gridApi) => {
    $scope.gridApi = gridApi;
};

我的最终结果

【讨论】：