Pagination with filters using ng-repeat in angular
<p>I am trying to do a pagination using filters. </p>

<p>There is a list with names and countries.</p>

<p>I am trying to filter them by country and also alphabetical range, and then generate the pagination by numbers. I am really stuck with it. any help will be really appreciate it</p>

<p>The alphabetical filter will retrieve the names that start with the the range of letters. For example if you select the first option [A - M] will return the person that their name start within that range of letters </p>

<p>Here is my code. The html is over there. Thanks</p>

<p><a href="http://jsbin.com/cifowatuzu/edit?html,js,output" rel="nofollow">http://jsbin.com/cifowatuzu/edit?html,js,output</a></p>

<pre><code>angular.module('app',['angular.filter'])
.controller('MainController', function($scope) { 

$scope.selectedCountry = '';
$scope.currentPage = 1;
$scope.pageSize = 3;
$scope.pages = [];

//This should store {StartFrom and To from selected Range}
$scope.selectedRange = '';

$scope.AlphabethicalRange = [
  {StartFrom: 'A', To: 'M'},
  {StartFrom: 'N', To: 'Z'}
];

$scope.Countries = [
{ Name : 'USA'},
{ Name : 'Japan'},
{ Name : 'France'},
{ Name : 'Canada'},
{ Name : 'China'},
];

$scope.People = [
{ Id: 1, Name: 'Will', Country: 'USA'},
{ Id: 2, Name: 'Ed', Country: 'USA' },
{ Id: 3, Name: 'Peter', Country: 'China'},
{ Id: 4, Name: 'John', Country: 'Japan'},
{ Id: 5, Name: 'Alex', Country: 'France'},
{ Id: 6, Name: 'Jim', Country: 'France'},
{ Id: 7, Name: 'Austin', Country: 'Italy'},
{ Id: 8, Name: 'Men', Country: 'France'},
{ Id: 9, Name: 'Zike', Country: 'Canada'},
];

$scope.numberPages = Math.ceil($scope.People.length / $scope.pageSize);

$scope.init = function () {
 for (i = 1; i &lt; $scope.numberPages; i++) {
      $scope.pages.push(i);
   }

    };

    $scope.init();
});
</code></pre>