范围函数角度的右设置

right set for range function angular

本文关键字:设置 函数 范围      更新时间:2023-09-26

var app=angular.module('MyApp', []);
app.controller("MyControler", function($scope, $http, $filter) {
      $http.get("http://127.0.0.1:8000/cars/?format=json").
        success(function(data) {
              $scope.list = data;
          });
    $scope.currentPage = 0;
    $scope.pageSize = 5;
    $scope.range = function() {
    var rangeSize = 10;
    var ret = [];
    var start;
    start = $scope.currentPage;
    if ( start > $scope.numberOfPages()-rangeSize ) {
      start = $scope.numberOfPages()-rangeSize+1;
    }
    for (var i=start; i<start+rangeSize; i++) {
      ret.push(i);
    }
    return ret;
  };
    $scope.numberOfPages=function(){
        var myFilteredData = $filter('filter')($scope.list, $scope.search);
        return Math.ceil(myFilteredData.length/$scope.pageSize);
    };
      $scope.prevPage = function() {
    if ($scope.currentPage > 0) {
      $scope.currentPage--;
    }
  };
  $scope.prevPageDisabled = function() {
    return $scope.currentPage === 0 ? "disabled" : "";
  };
    $scope.nextPage = function() {
    if ($scope.currentPage < $scope.numberOfPages()) {
      $scope.currentPage++;
    }
  };
  $scope.nextPageDisabled = function() {
    return $scope.currentPage === $scope.numberOfPages() ? "disabled" : "";
  };
 $scope.setPage = function(n) {
    $scope.currentPage = n;
  };
});
        <div class="pagination">
            <ul>
              <li ng-class="prevPageDisabled()">
                <a href ng-click="prevPage()">« Prev</a>
              </li>
              <li ng-repeat="n in range()"
              ng-class="{active: n == currentPage}" ng-click="setPage(n)">
              <a href="#">{{n+1}}</a>
            </li>
              <li ng-class="nextPageDisabled()">
                <a href ng-click="nextPage()">Next »</a>
              </li>
            </ul>
          </div>
  </div>

</body>
 <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
 
</html>

所以我试图减少我的代码,我的范围函数设置分页的可见性,多少页,但是当我开始过滤并且结果非常薄时,就像只剩下几个对象一样,分页也会向我显示带有减号的页面。

以为是因为它向我显示了过滤时留下或未包含的页面数量?

  $scope.range = function() {
    var rangeSize = 5;
    var ret = [];
    var start;
    start = $scope.currentPage;
    if ( start > $scope.numberOfPages()-rangeSize ) {
      start = $scope.numberOfPages()-rangeSize;
        if (start < 0) {
            start = 0;
        }
    }
    for (var i=start; i<start+rangeSize && i < $scope.numberOfPages(); i++) {
      ret.push(i);
    }
    return ret;
  };

奥基我找到了解决方案;)