为什么这种 ng 网格分页有效

Why is this ng-grid pagination working

本文关键字：分页 有效 网格 ng 为什么      更新时间：2023-09-26

以下是我对以下代码中的 if 条件的理解：

$scope.pagingOptions = {
    pageSizes: [250, 500, 1000],
    pageSize: 250,
    currentPage: 1
};
$scope.$watch('pagingOptions', function (newVal, oldVal) {
    if (newVal !== oldVal && newVal.currentPage !== oldVal.currentPage) {
          $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);
    }
}, true);

每当pagingOptions更改并且 currentPage 属性已更改时，if条件变为 true，因此将执行 getPagedDataAsync 方法。

但是，即使我不更改currentPage而是更改 UI 中的pageSize，网格也会刷新。我不希望发生这种情况（根据我的理解）。那么，为什么网格会刷新呢？

从这里，我获取了代码：

http://angular-ui.github.io/ng-grid/使用服务器端分页示例标题

$watch末尾的true表示对范围对象的深度监视pagingOptions。

因此，如果true作为可选的第三个参数传入，Angular 将进行深度相等检查。 因此，将检查pageSize属性是否相等，并且会有所不同。

此处提供了$watch和第三个参数[objectEquality]的文档。

提供的代码似乎包含不必要的复杂性。当执行"对象相等监视"（通过将 $watch 的第三个参数设置为 true ）时，将比较对象的属性值而不是对象引用。如果我们假设pageSizes属性值永远不会更改，则手表会正确通知我们，并且仅通知我们pageSize值和currentPage值的更改。所以里面唯一需要的代码是调用页面刷新：

$scope.$watch('pagingOptions', function () {
      $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);
}, true);

再添加一个手表

$scope.$watch('pagingOptions.pageSize', function (newVal, oldVal) {
 if (newVal !== oldVal && newVal.currentPage !== oldVal.currentPage) {
      $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);
    }
}, true);
相关文章：