1.0.4 • Published 7 years ago
mavi-angular-paginator v1.0.4
Mavi-angular-paginator
Simple pagination module fo Angular 1 and ui-router.
Install
- Be sure you have angular and ui-router installed
- Add mavi-paginator module script.
- Add "paginator" class to the element which is going to contain the pagination elements.
- To have it working you should pass from controller to "paginate" attribute the object which contains the information of:
- Items per page (example 10 items per page)
- Total items
#####Object:
"paginate": {"itemsPerPage":10,"totalItems":387};###Usage
App module
<script>
var App = angular.module('App', ['mavi-paginator','ui.router']);
//Ui-router
App.config(['$stateProvider', function($stateProvider) {
$stateProvider.state('customstate', {
url: '/customurl/:page',
templateUrl: 'template.html',
controller: 'theController',
params: {
page: "1"
}
});
}]);
//Controller
App.controller('theController', ['$scope', function($scope) {
$scope.paginate = {
"itemsPerPage":10,
"totalItems":387
};
});
</script>Template html
<html lang="en" ng-app="App">
<head>
<script src="angular.js"></script>
<script src="ui-state.js"></script>
<script src="mavi-paginator.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="theController">
....
<div class="paginator" paginate="paginate"></div>
....
</body>
</html>Prerequisites
Angular 1
Ui-routerNothing more ;)