[英]Why is this ng-grid pagination working
Here is what I understand by the if condition in the following code: 这是我通过以下代码中的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);
whenever the pagingOptions
changes and the currentPage
property has changed the if
conditions becomes true, so the getPagedDataAsync
method gets executed. 每当
pagingOptions
更改并且 currentPage
属性已更改时, if
条件变为true, getPagedDataAsync
执行getPagedDataAsync
方法。
But even if I don't change the currentPage
but the pageSize
from the UI, the grid gets refreshed. 但是,即使我不更改
currentPage
而是从UI更改pageSize
,网格也会刷新。 Which I don't expect to happen(according to my understanding). 我不希望发生(根据我的理解)。 So why is that grid getting refreshed?
那么,为什么网格会刷新?
From here, I have taken the code: 从这里开始,我采用了以下代码:
http://angular-ui.github.io/ng-grid/ with the Server-Side Paging Example heading http://angular-ui.github.io/ng-grid/ ( 服务器端分页示例标题)
The true
at the end of the $watch
indicates a deep watch of the scope object pagingOptions
. $watch
末尾的true
表示对作用域对象pagingOptions
的深入监视。
So, if true
is passed in as on optional third parameter, Angular will do a deep equality check. 因此,如果将
true
作为可选的第三个参数传入,则Angular将进行深度相等性检查。 Therefore, the pageSize
property will be checked for equality and will be different. 因此,将检查
pageSize
属性的相等性并将其不同。
Documentation for $watch
and the third parameter [objectEquality]
is here . $watch
和第三个参数[objectEquality]
文档在此处 。
The provided code seems to contain unnecessary complexity. 提供的代码似乎包含不必要的复杂性。 When doing an "object equality watch" (by setting the third argument of
$watch
to true
), object's property values are compared instead of object reference. 在执行“对象相等性监视”时 (通过将
$watch
的第三个参数设置为true
),将比较对象的属性值而不是对象引用。 If we suppose that pageSizes
property value never changes, the watch informs us properly and only about changes to pageSize
and currentPage
values. 如果我们假设
pageSizes
属性值从不更改,则手表会正确地通知我们,并且仅通知有关pageSize
和currentPage
值的更改。 So the only code needed inside is the call to page refresh: 因此,内部所需的唯一代码是对页面刷新的调用:
$scope.$watch('pagingOptions', function () {
$scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);
}, true);
Add one more watch 再添加一只手表
$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);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.