current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Dismiss
Announcing Stack Overflow Documentation

We started with Q&A. Technical documentation is next, and we need your help.

Whether you're a beginner or an experienced developer, you can contribute.

Sign up and start helping → Learn more about Documentation →
up vote 0 down vote favorite

Im getting an error with ui-bootstrap pagination Unknown provider: startFromFilterProvider

Here is my controller code:

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');
  };
}

Here is the 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>

Also I should mention that it does show the right amount of button numbers in "uib-pagination" button section. So the proper amount of pages loads just not data cause of the error.

How can I fix this

Thanks

share|improve this question
up vote 1 down vote accepted

It seems that you didn't declare or define the startFrom filter. There is an exemple found here : 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);
        }

    }
});
share|improve this answer
    
thumbs up! Thanks. – agon024 Aug 16 at 21:10
up vote 1 down vote

You are using a startFrom filter in the following expression: <div ng-repeat="obv in observed['Observed CARs'] | startFrom:(currentPage - 1) * pageSize | limitTo: pageSize" class="myCar">

You can probably copy the implementation for startFrom from your example, or you forgot to embed it. A common implementation is as follows:

module.filter('startFrom', function () {
  return function (input, skipCount) {
    if (!input) return input;
    return input.slice(skipCount);
  };
});
share|improve this answer
1  
yours works also so I up-voted you also – agon024 Aug 16 at 21:10

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.