限制和偏移数据在AngularJS中进行分页

一尘不染

限制和偏移数据在AngularJS中进行分页

angularjs

当调用支持它们的外部数据资源时，AngularJS是否具有Limit和Offset请求方法？

我想象有一个比这更优雅的解决方案，我通过routeParams传递限制和偏移量：

function ListCtrl($scope, $http, $routeParams) {
$http.jsonp('http://www.example.com/api/list.jsonp?callback=JSON_CALLBACK&limit=' + $routeParams.limit + '&offset=' + $routeParams.offset,{callback: 'JSON_CALLBACK'}).success(function(data) {
$scope.list = data;
  });
}

阅读 265

2020-07-04

共1个答案

一尘不染

完整的分页解决方案是：（1）与服务器/数据库进行通信的服务；（2）处理next / prev的指令；以及（3）将其粘合在一起的控制器。

一旦有了指令和服务，您的控制器就是这样简单：

app.controller('MainCtrl', function($scope, myData) {
  $scope.numPerPage = 5;
  $scope.noOfPages = Math.ceil(myData.count() / $scope.numPerPage);
  $scope.currentPage = 1;

  $scope.setPage = function () {
    $scope.data = myData.get( ($scope.currentPage - 1) * $scope.numPerPage, $scope.numPerPage );
  };

  $scope.$watch( 'currentPage', $scope.setPage );
});

使用同样简单的HTML：

<body ng-controller="MainCtrl">
  <ul>
    <li ng-repeat="item in data">{{item.name}}</li>
  </ul>
  <pagination num-pages="noOfPages" current-page="currentPage" class="pagination-small"></pagination>
</body>

这是完整的Plunker：http
://plnkr.co/edit/Mg0USx?p=preview 。它使用ui-
bootstrap的分页指令，该指令正在进行中。

2020-07-04