How can I get server-side-pagination in ng-grid in AngularsJS

谁说胖子不能爱 提交于 2019-12-24 17:09:27

问题


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

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!