Angular UI Grid - 样式列菜单/应用模板

Question

我想使用angularjs ui-grid并且有一个条件：必须可以设置列过滤器菜单的样式。

在documentation中，仅解释了如何将新项目添加到列菜单，而不是如何更改设计或添加其他控件。如果我们查看the example，应该可以打开一个列菜单，可以显示两个自定义样式的单选按钮（男性，女性），两个按钮两个接受或拒绝更改。如果接受更改，则应应用过滤器。

是否有可能为列菜单使用模板，因为columns header可以使用模板？如何创建自定义列菜单？

谢谢。

Answer 1

请参阅plunker了解解决方案。

在您的columnDefs中，您只需添加menuItems。我无法从您的问题中理解您究竟想要这些额外的下拉选项，所以我在一个非常简单的示例中为您建模了一般格式，其中第一个自定义选项除了在菜单中显示而第二个激活警报包含列名称。如果这不够，请告诉我。

有关menuItems支持的属性的完整列表，请参阅this tutorial。

columnDefs: [
  {
    field: 'name',
    menuItems: [{
      title: 'Custom Nothing'
    }, {
      title: 'Column Name',
      action: function() {
        alert(this.context.col.displayName);
      }

    }]
  }

]

Answer 2

通过http://ui-grid.info/docs/#/api/ui.grid.class:GridOptions.columnDef#properties_headercellfilter

看到我认为OP正在寻找的东西，绝对是我想要的东西

令人讨厌的是，您似乎无法仅修改下拉模板，您必须覆盖整个标题单元格模板，但至少您可以在每个列的基础上执行此操作。