I attempted to implement a sample pagination feature by creating a directive like the following (I am not sure if it is correct):
(function() {
app.directive("myPagination", function() {
return {
restrict: 'E',
templateUrl: 'pag.html'
};
});
})();
The content of my pag.html file is as follows:
<ul class="pagination" ng-controller="PagingController">
<li ng-repeat="x in pageing" ng-click="change(x.pageno)"><a href="#">{{x.pageno}}</a></li>
</ul>
My PagingController looks like this:
app.controller('PagingController', function($scope) {
$scope.$on('pageinfo', function(event, args) {
$scope.numbtn = args.numbtn;
$scope.totaldata = args.totaldata;
$scope.selet = args.selet;
$scope.starter();
})
$scope.starter = function() {
$scope.pageing = [];
let i;
for (i = 0; i < $scope.numbtn; i++) {
$scope.pageing[i] = i;
}
console.log($scope.pageing);
}
$scope.change = function(btnclk) {
alert(btnclk);
}
});
In my index page, I tried using
<my-pagination></my-pagination>