问题
I have a ng-grid in angular application ,the data coming to grid from database by calling the web-services .services are
1.(GET) getAllCustomerListCount
which gives integer number like 6202.
2.(GET) getAllCustomerListByRange
which takes two parameters like startFrom
parameter takes integer which represent starting or begin range to display ,and another parameter noOfRecords
takes integer which represent no.of records to display .
As of now i am calling the getAllCustomerListCount
first to get the total no.of records from database,and secondly calling getAllCustomerListByRange
by passing startFrom
as 0 and noOfRecords
as first service result getAllCustomerListCount
i.e., total no.of records.It displays the grid data but it is too slow to display the 50 records per page and loading the total records 6202 records into grid .
Now i want to improve the performance even i place the page size 100 of grid.How can i call the services by selecting the next page in grid .My intention is not to allow load all the 6202 records in to grid at first time but it should display the total as 6202 and by clicking the next page in the grid have to call the services and get the 50 records data from database at that time only . Please help me how can i solve my problem.One more thing i can share my controller.
model plunker http://plnkr.co/edit/R8hmvzTTthGkDurtMErR?p=preview
in controller:
$scope.totalServerItems = 0;
$scope.pagingOptions = {
pageSizes: [50, 100, 200],
pageSize: 50,
currentPage: 1
};
$scope.setPagingData = function(data, page, pageSize){
var pagedData = data.slice((page - 1) * pageSize, page * pageSize);
$scope.myData = pagedData;
$scope.totalServerItems = data.length;
if (!$scope.$$phase) {
$scope.$apply();
}
};
来源:https://stackoverflow.com/questions/25604384/how-can-i-get-server-side-pagination-in-ng-grid-in-angularsjs