如何让ng-grid隐藏某些行

时间:2013-08-27 03:57:47

标签: angularjs filtering master-detail ng-grid

我想要在ng-grid中显示一系列对象。每行都有一个布尔属性isVisible。在ng-grid中,我想只显示isVisible为真的行。其他行应完全隐藏。

我尝试使用rowTemplate并将ng-show数据绑定到isVisible。这隐藏了行的内容,但保留了实际的行,显示了一个空行。

我已尝试使用filterOptions,但无法找出执行此类过滤的正确语法。我找不到任何关于如何设置它的好文档。

我甚至尝试修改ng-grid源中的gridTemplate,尝试在ng-repeat=\"row in renderedRows\"上添加过滤器,但我还没有这样做。

我想我可以通过暂时删除行来修改数组本身,但我宁愿不这样做,因为我必须能够再次显示行(它实际上是我正在做的扩展器) ,应该隐藏/显示子行)

1 个答案:

答案 0 :(得分:1)

尝试根据isVisible有条件地将模板中行的高度设置为“0”,或者使用带有ng-class的CSS类。使用它的CSS,直到你获得所需的效果,然后你可以在你的模板中使用它。

这听起来像是通过使用高度和CSS动画实际上受益的类型,因此它以动画样式打开和关闭。如果你有一个jsFiddle样本,我很乐意尝试帮助。

编辑:在看了网格实际如何布置它的行(绝对定位)之后,你真的有两个我能想到的选择:

1)通过类似dataVisible()的函数过滤绑定到网格的数据,但在控制器内部保留完整数据列表,以便您可以轻松显示/隐藏

2)使用您正在寻找的过滤功能向ng-grid项目(或分叉)提交补丁。开箱即用它似乎不支持这种情况。