AngularJS - ui-bootstrap 分页错误答案

【问题标题】：AngularJS - ui-bootstrap pagination errorAngularJS - ui-bootstrap 分页错误
【发布时间】：2016-08-16 20:55:03
【问题描述】：

ui-bootstrap 分页出现错误未知提供者：startFromFilterProvider

这是我的控制器代码：

function observedCars($scope, $http, API, CarDetailService, $state) {
  $http.get( API + '/car/?observed=true&offset=0&page_size=20' ).
  success(function(data) {
    $scope.observed = data;
  });

  $scope.pageSize = 5;
  $scope.currentPage = 1;

  $scope.selectCar = function(carId) {
    CarDetailService.setCar(carId);
    $state.go('taskDetails');
  };
}

这是 HTML：

<div ng-controller="observedCars">
  <div ng-repeat="obv in observed['Observed CARs'] | startFrom:(currentPage - 1) * pageSize | limitTo: pageSize" class="myCar">
    <div class="carId">{{ obv['Display Name'] }}</div>
    <div class="title">{{ obv['Project Title'] }}</div>
    <div class="status"> {{obv.Status}} </div>
    <h4><u>Current Approver</u></h4>
    <div class="currApp dont-break-out">{{obv['Current Approver']}}</div>
    <h4><u>Amount</u></h4>
    <div class="modified">${{obv.Amount | number:2}}</div>
    <div class="carBtnWrap">
      <div class="viewCar"><a ng-click="selectCar(obv['CAR ID'])">View Details</a></div>
    </div>
  </div>

  <ul uib-pagination total-items="observed['Observed CARs'].length" ng-model="currentPage" items-per-page="pageSize"></ul>

</div>

我还应该提到，它确实在“uib-pagination”按钮部分显示了正确数量的按钮编号。因此，加载适当数量的页面并不是导致错误的数据原因。

我该如何解决这个问题

谢谢

【问题讨论】：

标签： javascript jquery angularjs angular-ui-bootstrap

【解决方案1】：

您似乎没有声明或定义 startFrom 过滤器。这里有一个例子：AngularJS with AngularUI Bootsrap pagination directive doesn't hide results

app.filter('startFrom', function () {
    return function (input, start) {



        if (input === undefined || input === null || input.length === 0
         || start === undefined || start === null || start.length === 0 || start === NaN) return [];
        start = +start; //parse to int

        try {
            var result = input.slice(start);
            return result;

        } catch (e) {

        //    alert(input);
        }

    }
});

【讨论】：

点赞！谢谢。

【解决方案2】：

您正在以下表达式中使用startFrom 过滤器：<div ng-repeat="obv in observed['Observed CARs'] | startFrom:(currentPage - 1) * pageSize | limitTo: pageSize" class="myCar">

您可能可以从您的示例中复制startFrom 的实现，或者您忘记嵌入它。一个常见的实现如下：

module.filter('startFrom', function () {
  return function (input, skipCount) {
    if (!input) return input;
    return input.slice(skipCount);
  };
});

【讨论】：