如何仅在 AngularJS ui-grid 3.0 的第一个分组行中显示按钮？答案

【问题标题】：How to show a button only in first grouped row in AngularJS ui-grid 3.0?如何仅在 AngularJS ui-grid 3.0 的第一个分组行中显示按钮？
【发布时间】：2015-08-18 14:57:06
【问题描述】：

对于Plunker链接中分组的ui-grid，第三列，如何让按钮只显示在groupHeader行中？

Plunker：http://plnkr.co/edit/KNNUPhAmD91HeHkDaQyr?p=preview

我尝试在第三列上使用以下 cellTemplate，但它不起作用，因为第三列不是分组列。

cellTemplate: '<div ng-if="!col.grouping || col.grouping.groupPriority === undefined || col.grouping.groupPriority === null || ( row.groupHeader && col.grouping.groupPriority === row.treeLevel )" class="ui-grid-cell-contents" title="TOOLTIP">{{COL_FIELD CUSTOM_FILTERS}}</div>'

grid的大部分代码来自官方UI Gridtutorial 209。我刚刚添加了按钮部分。

【问题讨论】：

你能更新你的 plunker 吗？目前没有网格。还有你的照片（你实际上可以在这里上传）
@Asqan 请再次检查。我刚刚更新了它。感谢您的宝贵时间。

标签： javascript angularjs angular-ui-grid

【解决方案1】：

只需在您的单元格模板中添加ng-show

<button ng-show="row.treeLevel==0" type="button" class="btn btn-success">

这是您的 Plunker 的工作版本

http://plnkr.co/edit/vYpAi4AV0a9cidcoejFY?p=preview

【讨论】：

一旦您取消组合，就不再显示任何按钮，我猜这不是正确的行为，解决方案是使用 ng-show="row.treeLevel == 0 || !row.treeLevel"