2

这是问题的摘要：我设置了一个列 sortChange() 侦听器，它通过触发查询以获取新排序的数据来响应排序更改。我在获取之前保存网格状态，并在获取之后恢复网格状态。问题是恢复gridState机制触发了原来的排序监听器，导致整个过程重新开始，一次又一次，一次又一次。

scope.sitesGrid.onRegisterApi = function(gridApi) {
  scope.gridApi = gridApi;

  scope.gridApi.core.on.sortChanged(scope, function () {
    // load new sites on a sort change
    scope.initialize();
  });
};

scope.initialize = function() {
  // save current grid state
  scope.gridApi && (scope.gridState = scope.gridApi.saveState.save());

  fetchSites().then(function (sites) {
    scope.sitesGrid.data = sites
    // restore current grid state, but inadvertently retrigger the 'sortChanged' listener
    scope.gridApi.saveState.restore(scope,scope.gridState);
  })
};

我在想我可以在每个列标题上设置一个单击侦听器，而不是使用 sortChange 侦听器，但是这个解决方案看起来很难看，需要进入每个标题单元格模板并进行更改。

4

2 回答 2

1

使用某种范围变量来跟踪数据的加载情况如何？

scope.gridApi.core.on.sortChanged(scope, function () {
    if (!scope.isLoading) {
        scope.initialize();
    }
});

和

fetchSites().then(function (sites) {
    scope.isLoading = true;
    scope.sitesGrid.data = sites;
    scope.gridApi.saveState.restore(scope,scope.gridState);
    scope.isLoading = false;
})

timeout()如果有时间问题，您可能需要在地方添加一些调用。在这种情况下，创建一个 Plunker 来证明这一点会有所帮助。

于 2016-09-20T02:41:53.900 回答
0

我想我找到了解决方案。我在我的指令中创建了恢复功能（你可以在你想要的地方使用它）。我只是阻止执行下一次迭代，直到动作完成。

function restoreState() {
    if ($scope.gridState.columns !== undefined && !isRestoring) {  //check is any state exists and is restored
        isRestoring = true;  //set flag
             $scope.gridApi.saveState.restore($scope, $scope.gridState)
                  .then(function () {
                       isRestoring = false;  //after execute release flag
                   });
    }

}

function saveState() {
    if (!isRestoring) {
        $scope.gridState = $scope.gridApi.saveState.save();
    }
}
于 2018-11-27T13:33:44.897 回答