On my webpage, I have a large list of Json data that is organized with paging. The issue arises when selecting categories from the listbox as the data does not display properly.
When "All" is selected, each page shows the correct pageSize(4).
However, for other categories like Animation or Comedy, the pageSize limit is not applied correctly and the paging length remains unchanged.
In particular, selecting "Horror" results in nothing being displayed. Any help would be much appreciated.
Check out the plunker link here. Please wait a few seconds if the Json data is still loading.
// calculate page in place
$scope.groupToPages = function () {
$scope.pagedItems = [];
for (var i = 0; i < $scope.filteredItems.length; i++) {
if (i % $scope.pageSize === 0) {
$scope.pagedItems[Math.floor(i / $scope.pageSize)] = [ $scope.filteredItems[i] ];
} else {
$scope.pagedItems[Math.floor(i / $scope.pageSize)].push($scope.filteredItems[i]);
}
}
};