Question

我正在尝试将下拉菜单插入到ui-grid的列中。每个菜单项都会附加一个ng-click。

我正在使用ui-grid-unstable.min.js，因为分页似乎不适用于ui-grid-stable.min.js

按钮出现在网格中并注册它已被点击（开放类被添加到它）但它没有下拉。

我的ui-grid columndef看起来像这样：

this.gridOptions.columnDefs = [
{ field: 'Foo', displayName: 'Actions', cellTemplate: '/app/quiz/action.html', sortable: false }
];

cellTemplate代码来自“身体下拉”按钮示例https://angular-ui.github.io/bootstrap/ 它看起来像这样：

<div class="btn-group" dropdown dropdown-append-to-body>
  <button type="button" class="btn btn-primary dropdown-toggle" dropdown-toggle>
    Dropdown on Body <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a href="#">Action</a></li>
    <li><a href="#">Another action</a></li>
    <li><a href="#">Something else here</a></li>
    <li class="divider"></li>
    <li><a href="#">Separated link</a></li>
  </ul>
</div>

ui.bootstrap包含在我的app模块中，.css和.js文件包含在我的index.html中

我看了一下这个：Angular UI Grid: How to create a pre-populated dropdown menu for column filtering和其他一些人，但他们似乎处理创建绑定选择（不是下拉菜单）并在堆栈溢出上搜索其他类似的项目，但我找不到解决我的问题按钮菜单甚至没有下降。

Answer 1

进一步的研究表明，这是因为ui-grid单元上的类是溢出隐藏的。通过添加一个带溢出的类：可见单元格的columnDef我能够解决问题。

Answer 2

在dropdown-append-to-body或uib-dropdown指令附近添加dropdown有助于解决overflow:hidden问题。也在ui-grid单元内。

<div class="btn-group" uib-dropdown dropdown-append-to-body>
...
</div>

角度ui-grid列中的下拉菜单不会下降

2 个答案: