2016-12-30 2 views
1

Моей Угловая JS Paginator и выберите вариант не работает right.Here это код:Угловой JS пагинация

<select class="select" ng-model="pageSize"> 
     <option value="5">5</option> 
     <option value="10">10</option> 
     <option value="50">50</option> 
     <option value="100">100</option> 
     </select>/{{ books.length }} &nbsp; &nbsp; <button class="paginator" ng-disabled="currentPage == 0" ng-click="currentPage=currentPage-1"> 
     Előző 
    </button> 
    {{currentPage+1}}/{{numberOfPages()}} 
    <button class="paginator" ng-disabled="currentPage >= books.length/pageSize - 1" ng-click="currentPage=currentPage+1"> 
     Következő 
    </button></span>&nbsp; &nbsp; 
    <i class="fa fa-sort-numeric-asc floatright" aria-hidden="true"></i><input type="checkbox" data-ng-model="order.reverse"/>&nbsp; &nbsp;&nbsp; &nbsp; 

      <button id="help" type="button" data-toggle="modal" data-target="#myModal" title="SÚGÓ"><i class="fa fa-question-circle" aria-hidden="true"></i></button></h1> 
     </div> 
      <div class="panel-heading"> 

      </div> 
<table class="table table-bordered"> 
    <thead> 
    <tr> 
    <th></th> 
     <th>Név</th> 
     <th>Dátum</th> 
     <th>Típus</th> 
     <th>Összeg</th> 
     <th>Megjegyzés</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr data-ng-repeat="user in books.slice(currentPage*pageSize, (currentPage*pageSize)+PageSize | orderBy:dynamicOrder:order.reverse | filter:query"> 
       <td><input type="checkbox" id="chk" ng-model="user.done"></td> 

       <td style="display:none;"><span class="done-{{item.done}}"> {{user.id}}</span></td> 
       <td style="background-color:{{user.money>0?'#EAE6E6':''}}"><span class="done-{{user.done}}"> {{user.name}}</span></td> 
       <td style="background-color:{{user.money>0?'#EAE6E6':''}}"><span class="done-{{user.done}}"> {{user.date}}</span></td> 
       <td style="background-color:{{user.money>0?'#EAE6E6':''}}"><span class="done-{{user.done}}"> {{user.type}}</span></td> 
       <td style="background-color:{{user.money>0?'#EAE6E6':''}}"><span class="done-{{user.done}}"> {{user.money}}</span></td> 
       <td style="background-color:{{user.money>0?'#EAE6E6':''}}"><span class="done-{{user.done}}"> {{user.etc}}</span></td> 
       </tr> 

      </tbody> 
     </table> 

вар приложение = angular.module ('myBookscatApp', []). контроллер ('BooksListCtrl', функция ($ сфера, $ HTTP) {

$scope.currentPage = 0; 
    $scope.pageSize = 10; 


    $scope.numberOfPages=function(){ 
     return Math.ceil($scope.books.length/$scope.pageSize);     
    } 

    $scope.order = { 
     field: 'date', 
     reverse: false 
    }; 
    $scope.reverseOrder = false; 
} 

Вы можете увидеть в работе: enter link description here пользователь: гость, пароль: тест

Many thanx!

ответ

0

Вы можете использовать директиву this для разбивки на страницы. У него много функций, которые вам не нужно писать самостоятельно.