Pagination example

<!DOCTYPE html>
<html>

  <head>
    <link data-require="bootstrap-css@3.1.*" data-semver="3.1.1" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
    <link  rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.css" />
    <script data-semver="2.1.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.7/angular.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.0/ui-bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.0/ui-bootstrap-tpls.min.js"></script>
    
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app="pagination" ng-controller="Example">
    <h1>Pagination.</h1>
    <ul><li ng-repeat="i in theActualDisplayList track by $index">{{i}}</li></ul>
    <pagination total-items="totalItems" ng-model="currentPage" max-size="5" boundary-links="true" items-per-page="numPerPage" class="pagination-sm"></pagination>
  </body>
</html>

// Code goes here

var app = angular.module('pagination', ['ui.bootstrap']);

app.controller('Example', function($scope){
  $scope.lists = [
    1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,15
  ];
  $scope.totalItems = $scope.lists.length;
  $scope.currentPage = 1;
  $scope.numPerPage = 8;
  $scope.theActualDisplayList = [];

  $scope.$watch('currentPage', function(page) {
    if($scope.currentPage) {
      var spliceFrom = ($scope.currentPage - 1) * $scope.numPerPage; 
      var offset = spliceFrom + $scope.numPerPage;
      $scope.theActualDisplayList = [];
      for (var i = spliceFrom; i < offset; i++) {
        if(i === $scope.lists.length) return false;
          $scope.theActualDisplayList.push($scope.lists[i]);
        }
    }
  });

});

/* Styles go here */