title: Paginate, custom filter, AngularJS
body: <p>I'm creating a list of objects with some embedded html and I added a filter, but by what they see something wrong I want to throw me out please.</p>
  
  <p>This is the example to pagination: <a href="http://plnkr.co/edit/79yrgwiwvan3bAG5SnKx?p=preview" rel="nofollow">PLUNKR</a></p>
  
  <p>**</p>
  
  <h2>It is supposed to display a list with paging due and applying the filter.</h2>
  
  <p>**</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>angular.module('App', ['ui.bootstrap','ngResource'])
  .controller('mainCtrl',['$scope',
   function($scope){
    $scope.items=[
     {id: '1', title: '&lt;b&gt;Chicago&lt;/b&gt;'},
     {id: '2', title: '&lt;b&gt;&lt;i&gt;New York&lt;/i&gt;&lt;/b&gt;'},
     {id: '3', title: '&lt;div&gt;&lt;p&gt;London&lt;/p&gt;&lt;/div&gt;'},
     {id: '4', title: '&lt;div&gt;&lt;p&gt;Washington&lt;/p&gt;&lt;/div&gt;'},
     {id: '5', title: '&lt;div&gt;&lt;p&gt;Hawai&lt;/p&gt;&lt;/div&gt;'},
     {id: '6', title: '&lt;div&gt;&lt;p&gt;Dinamarca&lt;/p&gt;&lt;/div&gt;'},
     {id: '7', title: '&lt;div&gt;&lt;p&gt;Peru&lt;/p&gt;&lt;/div&gt;'},
     {id: '8', title: '&lt;div&gt;&lt;p&gt;USA&lt;/p&gt;&lt;/div&gt;'},
     {id: '9', title: '&lt;div&gt;&lt;p&gt;Ecuador&lt;/p&gt;&lt;/div&gt;'},
     {id: '10', title: '&lt;div&gt;&lt;p&gt;Japon&lt;/p&gt;&lt;/div&gt;'}
    ];
  
    $scope.totalItems = $scope.objects.length;
    $scope.currentPage = 1;
    $scope.numPerPage = 5;
  
    $scope.paginate = function(value) {
     var begin, end, index;
     begin = ($scope.currentPage - 1) * $scope.numPerPage;
     end = begin + $scope.numPerPage;
     index = $scope.objects.indexOf(value);
     return (begin &lt;= index &amp;&amp; index &lt; end);
    };
   }
  ])
  
  .filter("htmlToPlaintext", function() {
   return function(text) {
   return text.replace(/&lt;[^&gt;]+&gt;/gm, '');
   }
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://code.angularjs.org/1.3.15/angular.js"&gt;&lt;/script&gt;
  &lt;script src="https://code.angularjs.org/1.3.15/angular-resource.js"&gt;&lt;/script&gt;
  &lt;script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.13.0.js"&gt;&lt;/script&gt;
  &lt;div ng-app="App"&gt;
   &lt;div ng-controller="mainCtrl"&gt;
    &lt;div ng-repeat="item in items | filter : paginate"&gt;
     {{item.title|htmlToPlaintext}}
    &lt;/div&gt;
    &lt;pagination total-items="totalItems" ng-model="currentPage"
   max-size="5" boundary-links="true"
   items-per-page="numPerPage" class="pagination-lg"&gt;
   &lt;/pagination&gt;
   &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>