HTML:
<div class="grid-style" data-ng-grid="groupGrid"> </div> Javascript:
appRoot.controller('GroupController', function ($scope, $location, $resource, $http) { var groupResource = $resource('/api/group', {}, { update: { method: 'PUT' }, add: { method: 'POST'} }); $scope.groupList = []; groupResource.query(function (data) { $scope.groupList.length = 0; angular.forEach(data, function (groupData) { $scope.groupList.push(groupData); }); }); $scope.totalServerItems = 0; $scope.pagingOptions = { pageSizes: [4, 8, 12, 16], pageSize: 250, currentPage: 1 }; $scope.setPagingData = function (data, page, pageSize) { var pagedData = data.slice((page - 1) * pageSize, page * pageSize); $scope.groupList = pagedData; $scope.totalServerItems = data.length; $scope.currentPage = page; if (!$scope.$$phase) { $scope.$apply(); } }; $scope.getPagedDataAsync = function (pageSize, page, searchText) { setTimeout(function () { var data; if (searchText) { var ft = searchText.toLowerCase(); $http.get('/api/group').success(function (largeLoad) { data = largeLoad.filter(function (item) { return JSON.stringify(item).toLowerCase().indexOf(ft) != -1; }); $scope.setPagingData(data, page, pageSize); }); } else { $http.get('/api/group').success(function (largeLoad) { $scope.setPagingData(largeLoad, page, pageSize); }); } }, 100); }; $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage); $scope.$watch('pagingOptions', function (newVal, oldVal) { if (newVal !== oldVal && newVal.currentPage !== oldVal.currentPage) { $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage); } }, true); $scope.selectedGroups = []; $scope.groupGrid = { data: 'groupList', multiSelect: false, selectedItems: $scope.selectedGroups, enableColumnResize: false, enablePaging: true, showFooter: true, totalServerItems: 'totalServerItems', pagingOptions: $scope.pagingOptions, columnDefs: [ { field: 'groupName', displayName: 'Group Name', width: '25%' } ], }; }); My problem - Pagination is not working, as in - The current page number is not displayed. - When I change the page size (like say 4), the number of items in the grid doesn't change (remains 16 - total no. of items I actually have). - The number of items change in the grid only after clicking the next page button twice.
