Question

由于我不是一位经验丰富的开发人员，尤其是AngularJS，我想请求一些帮助。我读过类似的主题，但我无法解决我遇到的问题。

我想要做的是从json文件中获取数据，＆＃39;提取＆＃39;这些数据的类别，将它们呈现为选项卡（菜单项），并呈现按这些类别过滤的数据。

因为数据很长我需要分页。我为此使用了ui.bootstrap。

所以在我看来，我有：

<li ng-repeat="category in categories">
  <a ng-click="setGamesByCategory(category)" class="games-tab" href="">{{category}} </a>
</li>

<div ng-repeat="game in filteredGames " class="game-item col-md-3">
    <img class="games__img" ng-src="{{path + game.image}}">
    <span class="games__name">{{game.fullName}} {{game.categoryDesc}}</span>
</div>

<pagination ng-model="currentPage" total-items="filteredGames.length" max-size="maxSize" boundary-links="true" items-per-page = "numPerPage"> </pagination>

在我的控制器和$ http.get（）里面我有

$scope.allGames = data;
$scope.getAllCategories(data);
$scope.filteredGames = $scope.allGames;

getAllCategories函数运行正常。

setGamesByCategory是这样的：

 $scope.currentPage = 1;
 $scope.categoryGames = [];

 // for every game in data
 $scope.allGames.forEach(function(game){
     //more code
 });


 $scope.$watch('currentPage + numPerPage', function() {
   var begin = (($scope.currentPage - 1) * $scope.numPerPage),
   end = begin + $scope.numPerPage;

  $scope.filteredGames = $scope.categoryGames.slice(begin, end);
});

问题是游戏是按类别而不是全部来呈现的，因为分页不起作用或不适用于所有标签。对于2个标签我看到它正在工作，我做了一些小的改动，但是当＆＃34; categoryGames＆＃34;分页很多，但是没有用。

有什么想法/想法吗？我会很感激甚至小修正！

分页并不完全适用于AngularJS - ui.bootstrap

0 个答案: