2016-01-04 29 views
0

分頁不會像這樣顯示。對於動態搜索結果,不顯示angularjs分頁

顯示結果計數的數量應該是25。然後將頁計數器應顯示類似的東西,以

1 2 3 4 5 .... 20接着

每5頁記錄應顯示。請幫助解決這個問題,我嘗試了不同的方式,但仍然無法找到解決方案。

dataservice.getData().then(function (dataResponse) { 
 
     //debugger; 
 
     // $scope.venues = dataResponse.data.ListingGuid; 
 
     venueListSort = dataResponse.data.UserListings; 
 
     //$(".se-pre-con").fadeOut("slow");    
 
     $scope.venues = dataResponse.data.UserListings; 
 
     $scope.viewby = 2; 
 
     $scope.totalItems = dataResponse.data.UserListings.length; 
 
     $scope.currentPage = 1; 
 
     $scope.itemsPerPage = 5; 
 
     $scope.maxSize = 5; //Number of pager buttons to show 
 

 
     $scope.setPage = function (pageNo) { 
 
      $scope.currentPage = pageNo; 
 
     }; 
 

 
     $scope.pageChanged = function() { 
 
      console.log('Page changed to: ' + $scope.currentPage); 
 
     }; 
 

 
     $scope.setItemsPerPage = function (num) { 
 
      $scope.itemsPerPage = num; 
 
      $scope.currentPage = 1; //reset to first paghe 
 
     }; 
 
     if ($scope.venues.length == 0) { 
 
      //$("#NotFound").show(); 
 
      $("#NotFound").css("display", "block"); 
 

 
     } 
 
     else { 
 
      $("#NotFound").css("display", "none"); 
 
     } 
 
     
 

 
<!-- begin snippet: js hide: false -->
hear is my view in cshtml page 
 
<body ng-controller="VenueCtrl" ng-app="DemoApp" id="AppHere"> 
 
<div class="list-item row" ng-repeat="venue in venues.slice(((currentPage-1)*itemsPerPage), ((currentPage)*itemsPerPage)) | dynamicFilter:Filters:this"> 
 
        <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 margin-padding-none"> 
 
         <div class="carousel-demo" style="width:100%"> 
 
          <ul rn-carousel rn-carousel-controls rn-carousel-index="carouselIndex" rn-carousel-buffered class="carousel1" ng-mouseover="changecolor($index)"> 
 
           <li ng-repeat="slide in venue.listImageGallery track by $index" ng-class="'id-' + ($index+1)"> 
 

 
            <div ng-style="{'background-image': 'url(' + slide.ImageURL + ')'}" class="bgimage"> 
 
            </div> 
 
           </li> 
 

 
          </ul> 
 
         </div> 
 
        </div> 
 
    </div> 
 

 
<div> 
 
        <pagination total-items="totalItems" ng-model="currentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false" num-pages="numPages" items-per-page="itemsPerPage"></pagination> 
 
        <pre>Page: {{currentPage}}/{{numPages}}</pre> 
 
       </div> 
 
</body>

回答

0
<pagination total-items="totalItems" ng-model="currentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false"num-pages="numPages" items-per-page="itemsPerPage"></pagination> 
       <pre>Page: {{currentPage}}/{{numPages}}</pre> 
      </div> 

分頁指令的.js和它的依賴添加到您的主角度模塊

+0

@ Shrikantü可以請澄清你的點,即時通訊新的angularjs我都試過了。 .i已添加此視圖 –

+0

您在視圖中添加但未正確注入,請在此處提供您的代碼。 – Shrikant

+0

@ Shrikant我已編輯上面的代碼,請檢查一次..可以請你糾正它..所以我可以輕鬆實現.. –