Showing posts with label Angularjs table ng-repeate Simple Pagination. Show all posts
Showing posts with label Angularjs table ng-repeate Simple Pagination. Show all posts

Angularjs table ng-repeate Simple Pagination

Angularjs table ng-repeate Simple Pagination

Hi Today discussed Angularjs table ng-repeate Simple Pagination Angularjs api web services data provide table ng-repeate custom features sorting and filter and Pagination added follows code.

html Files
Angularjs table ng-repeate Simple Pagination
Angularjs table ng-repeate Simple Pagination


<div ng-controller="MyCtrl">
    <ul>
        <li ng-repeat="item in data | startFrom:currentPage*pageSize | limitTo:pageSize">
            {{item}}
        </li>
    </ul>
    <button ng-disabled="currentPage == 0" ng-click="currentPage=currentPage-1">
        Previous
    </button>
    {{currentPage+1}}/{{data.length/pageSize}}
    <button ng-disabled="currentPage >= data.length/pageSize - 1" ng-click="currentPage=currentPage+1">
        Next
    </button>
</div>

controller.js

var app=angular.module('myApp', []);

function MyCtrl($scope) {
    $scope.currentPage = 0;
    $scope.pageSize = 10;
    $scope.data = [];
    for (var i=0; i<50; i++) {
        $scope.data.push("Item "+i);
    }
}

//We already have a limitTo filter built-in to angular,
//let's make a startFrom filter
app.filter('startFrom', function() {
    return function(input, start) {
        start = +start; //parse to int
        return input.slice(start);
    }
});