如何隐藏NG-网​​格行 [英] How to hide rows in ng-grid

问题描述

背景：我一直在我们的应用程序转换几页用AngularJS作为主要的建筑大修的尝试。到目前为止角已被证明是对我很好，而其学习曲线是pretty犀利，不过没关系。

Background: I've been working on converting few pages in our applications to use AngularJS as an attempt for major architecture overhaul. So far Angular had proven to be friendly to me while its learning curve is pretty sharp, but that's okay.

在我们的主页之一，我们slickgrid和我已经决定使用NG-电网，而不是slickgrid的对自己头痛保存在我的第一通行证。由于我们的应用程序的性质，相同的数据将在整个页面的生命周期进行过滤/未过滤的许多倍。整个数据集将始终保持完全一致，并且只有20-40个数据点为止。

In one of our main page, we have slickgrid and I had decided to use ng-grid instead of slickgrid to save myself from headache in my first pass. Due to the nature of our app, the same data will be filtered/un-filtered many times throughout the page lifecycle. The whole dataset will always remain exactly the same and there is only 20-40 data points so far.

功能它是通过重新分配数据的工作没关系 gridOptins.data 。然而，有打，内存严重的性能从迎上〜20MB到64MB〜只有在数过滤周期。而且越来越慢（> 40毫秒）为电网完成重新渲染。时间轴探查发现正在创建的DOM巨量每次网格数据被改变。

Functionality it's working okay by re-assign data for gridOptins.data. However, there is serious performance hit as memory went up from ~20MB to ~64MB only within a few filter cycle. And it's getting slow (>40ms) for the grid to complete re-render. Timeline profiler reveals massive amount of DOM is being created every time grid data is changed.

我已经说服自己，这是不切实际的，从经常NG-网格中删除/插入的数据点，我期待在这个问题上的一些解决方法。一个是刚刚隐藏的数据点，但我还没有看到，说明这个例子。

I had convinced myself that it's impractical to frequently remove/insert data points from ng-grid and I'm looking for some workaround on this issue. One being just hide the data point but I'm yet to see examples that illustrate this.

其他sugestions欢迎了。

Other sugestions are welcome, too.

编辑：这里的plunkr：

edit: Here's the plunkr:

http://plnkr.co/edit/dgA2HW

试着点击过滤器经常和手表总内存自身建设起来。

Try clicking filter frequently and watch the total memory build itself up.

推荐答案

您可以从电网中使用filterText ...

You could use filterText from the grid...

$scope.randomfilter = function() {

  $scope.gridOptions.$gridScope.filterText = Math.ceil(24 * Math.random());
};

$scope.resetfilter = function() {
  $scope.gridOptions.$gridScope.filterText = "";
};

http://plnkr.co/edit/DmgIS9?p=$p$ PVIEW

这篇关于如何隐藏NG-网​​格行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！