AngularJS pagination directive

<!DOCTYPE html>
<html ng-app="app">

  <head>
    <link rel="stylesheet" href="style.css">
    <script data-require="angularjs@1.5.5" data-semver="1.5.5" src="https://code.angularjs.org/1.5.5/angular.js"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="PagerController">
    <div ng-repeat="data in displayItems">
      <span>Data {{data}}</span>
    </div>
    <paging-control paging-size="pagingSize" noofitem="dataPerPage" total-items="totalItems" display-items="displayItems"></paging-control>
  </body>

</html>

.pager {
  display: inline-block;
  padding-left: 0;
  margin: 20px 0;
  border-radius: 4px;
}
.pager>li {
  display: inline;
}
.pager>li>a {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #fff;
    text-decoration: none;
    background-color: #969596;
    border: 1px solid #000;
}
.pager>li>a {
  cursor: pointer;
}
.pager>.active>a {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #bb0731;
    border-color: #bb0731;
}
.disabled {
  background-color: #B7B7B7 !important;
}
.disabled>a {
  cursor: default !important;
  color: #B7B7B7 !important;
}

AngularJS pagination directive with four paramaters
1- Paging size
2- No of item per page
3- Total Items array(sorted)
4- Result array object

(function() {
  function PagingController($scope) {
  	
  	$scope.pager = {};
	  $scope.pagingSize = $scope.pagingSize || 10;
	  $scope.itemPerPage = $scope.itemPerPage || 10;
  	
  	function setPager (itemCount, currentPage, itemPerPage) {
  		currentPage = currentPage || 1;
  		var startPage, endPage;

  		var totalPages = Math.ceil(itemCount / itemPerPage);		
  		if (totalPages <= $scope.pagingSize) {
      	startPage = 1;
      	endPage = totalPages;
      } else {
      	if (currentPage + 1 >= totalPages) {
      		startPage = totalPages - ($scope.pagingSize - 1);
      		endPage = totalPages;
      	} else {
      		startPage = currentPage - parseInt($scope.pagingSize/2);
      		startPage = startPage <= 0 ? 1 : startPage;
      		endPage = (startPage + $scope.pagingSize - 1) <= totalPages ? (startPage + $scope.pagingSize - 1) : totalPages;
      		if(totalPages === endPage) {
      		  startPage = endPage - $scope.pagingSize + 1;
      		}
      	}
      }
  
  		var startIndex = (currentPage - 1) * itemPerPage;
  		var endIndex = startIndex + itemPerPage - 1;
  
      var index = startPage;
  		var pages = [];
  		for(; index < endPage + 1; index++)
  		  pages.push(index);
  		  
  		$scope.pager.currentPage = currentPage;
  		$scope.pager.totalPages = totalPages;
  		$scope.pager.startPage = startPage;
  		$scope.pager.endPage = endPage;
  		$scope.pager.startIndex = startIndex;
  		$scope.pager.endIndex = endIndex;
  		$scope.pager.pages = pages;
  	}
  	
  	$scope.setPage = function(currentPage) {
  		if (currentPage < 1 || currentPage > $scope.pager.totalPages)
  			return;
  
  		setPager($scope.totalItems.length, currentPage, $scope.itemPerPage);
  		$scope.displayItems = $scope.totalItems.slice($scope.pager.startIndex, $scope.pager.endIndex + 1);
  	};
  	
  	$scope.setPage(1);
  }
  
  function PagerController($scope){
    $scope.pagingSize = 5;
    $scope.dataPerPage = 10;
    $scope.totalItems = [];
    
  	for(var i=1; i <= 200; i++)
  	  $scope.totalItems.push(i);
  	  
  	$scope.displayItems = [];
  }
    
  angular.module('app', []).controller('PagerController', ['$scope', PagerController]).directive('pagingControl', [function(){
    return {
      restrict: 'E',
      templateUrl: 'paging.html',
      controller: ['$scope', PagingController],
      scope: {
        totalItems: "=",
        displayItems: '=',
        pagingSize: '=',
        itemPerPage: '=noofitem'
      }
    };
  }]);
})();

<ul ng-if="pager.pages.length" class="pager">
    <li ng-class="{disabled:pager.currentPage === 1}">
        <a ng-click="setPage(1)">First</a>
    </li>
    <li ng-class="{disabled:pager.currentPage === 1}">
        <a ng-click="setPage(pager.currentPage - 1)">Previous</a>
    </li>
    <li ng-repeat="page in pager.pages" ng-class="{active:pager.currentPage === page}">
        <a ng-click="setPage(page)">{{page}}</a>
    </li>                
    <li ng-class="{disabled:pager.currentPage === pager.totalPages}">
        <a ng-click="setPage(pager.currentPage + 1)">Next</a>
    </li>
    <li ng-class="{disabled:pager.currentPage === pager.totalPages}">
        <a ng-click="setPage(pager.totalPages)">Last</a>
    </li>
</ul>