如何用angularJS

时间:2017-06-05 12:43:13

标签: angularjs ionic-framework

我正在使用angularJS和php后端,我有一个很长的桌子,我试图在每页中只显示五行。问题是我成功只显示了五个项目,但我无法看到在页面之间导航的分页栏。请问哪里有问题!

app.js

app.controller('AdminCtrl', function($scope, $http,$state){

      $scope.loadItem = function(){ 
              $http.get("http://localhost/deb/loadItem.php")  
           .success(function(data){   
                $scope.names = data; 
                $scope.currentPage = 1; //current page
                $scope.entryLimit = 5; //max no of items to display in a page
                $scope.filteredItems = $scope.names.length; //Initially for no filter  
                $scope.totalItems = $scope.names.length; 
           });
      }  
       $scope.setPage = function(pageNo) {
        $scope.currentPage = pageNo;
    };
    $scope.filter = function() {
        $timeout(function() { 
            $scope.filteredItems = $scope.filtered.length;
        }, 10);
    };
});

的test.html

<div class="padding" ng-controller="AdminCtrl" ng-init="loadItem()" >
<table>
<tr>
    <th>code</th>
    <th>Client</th>
  </tr>
  <tr ng-repeat="x in filtered=(names|filter:search)|startFrom:(currentPage-1)*entryLimit | limitTo:entryLimit">
    <td>{{x.Code}}</td>
    <td>{{x.Nom}}</td>
    </tr>
 </table>
        <div class="col-md-12" ng-show="filteredItems > 0">    
            <div pagination="" page="currentPage" on-select-page="setPage(page)" boundary-links="true" total-items="filteredItems" items-per-page="entryLimit" class="pagination-small" previous-text="&laquo;" next-text="&raquo;"></div>      
        </div>

提前致谢

0 个答案:

没有答案