坚持选行的正确方法 [英] Persist selected rows the correct way

问题描述

我想利用 ngGrid 的。
再$ P $名单psents一堆该用户，那么可以选择（或没有）项目。这种选择应如此坚持，当用户回来格显示相同的所选项目的最后一次。 我做了一个plunker

不过我碰到了一点使用ngGrid的问题。

However I've run into a bit of a problem using ngGrid.

我用 afterSelectionChange 保存选择更改到网格中。

I'm using afterSelectionChange to save selection changes to the grid.

$scope.gridOptions = { 
  data: 'myData',
  showSelectionCheckbox: true,
  afterSelectionChange: function(rowItem, event) {
    // $http... save selection state
  }
};

这很好。然而，当我想以编程方式选择行页面加载时，所有的地狱破散。下面code应该选择具有名称伊诺斯的行，它的作用。但它触发 afterSelectionChange 4倍。

$scope.$on('ngGridEventData', function() {
    angular.forEach($scope.myData, function(data, index) {
        if (data.name == 'Enos') {
            $scope.gridOptions.selectItem(index, true);
        }
    });
});

这是无法预期的。 我做了一个plunker 。

That can't be intended. I made a plunker.

如何使用ngGrid坚持选定的行？

How to persist selected rows using ngGrid?

推荐答案

不知道为什么，这是射击4次，但是当你使用selectedItems它不会发生：

Don't know why this is firing 4 Times, but it does not happen when you use selectedItems:

$scope.gridOptions = { 
  data: 'myData',
  showSelectionCheckbox: true,
  selectedItems:$scope.output
};

不是一个真正的答案，但也许它可以帮助你。

Not really an answer, but maybe it helps you.

叉形Plunker

更新
发现多一些：

Update Found out some more:

事件 ngGridEventData 被触发2次：

1. 在初始化和后选择信息由观察者。

此外 afterSelectionChange 触发2次。从第一次调用的rowItem是一个克隆（从缓存？）第二个是noClone。

Also afterSelectionChange is fired 2 time. The rowItem from first call is a clone (from cache?) the second one is noClone.

此总结了4个！

因此​​，通过采取初始化了 ngGridEventdata ，并用超时取代它，以及只推rowitems当他们是一个克隆（为什么？）解决此问题。

So by taking init out of ngGridEventdata and replacing it with a timeout as well as only pushing rowitems when they are a clone (why?) resolves this issue.

    $scope.gridOptions = {
    data: 'myData',
    showSelectionCheckbox: true,
    afterSelectionChange: function(rowItem, event) {
      if (rowItem.isClone) {
        $scope.output.push({
          name: rowItem.entity.name,
          selected: rowItem.selected
        });
        $scope.num++;
      }
    }
    };
    setTimeout(function() {
    angular.forEach($scope.myData, function(data, index) {
      if (data.name == 'Enos') {
        $scope.gridOptions.selectItem(index, true);
      }
    });
    })

我知道这仍然不是一个答案，闻起来像一个bug给我，但这里是另一个分叉的 Plunker无论如何的。

当然，你现在必须找到一种方法如何拼接项目出数组时，他们都未被选择。祝你好运！

Of course you now have to find a way how to splice items out of the array when they are unselected. Good Luck!

这篇关于坚持选行的正确方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！