ngInfiniteScroll中的一個簡單的錯誤

我已經使用了ngInfiniteScroll，但我有一個小問題，例如，我有一組數據在變量項目中，但是我想在第一個視圖上顯示5，其餘的在滑動上。但我的代碼加載所有的20個在第一視圖如何能夠做到這一點，我已經給我的代碼如下和我的數據結構ngInfiniteScroll中的一個簡單的錯誤

{ 
"data": [ { 
       "name": "Hoarding Majestic", 
       "code": 456, 
       "image": "assets/images/images/hoarding1.jpg", 
       "location": "Majestic" 


      }, 
      { 
       "name": "BusShelter ForumMall", 
       "code": 452, 
       "image": "assets/images/images/hoarding2.jpg", 
       "location": "Whitefield" 


      }, 
      { 
       "name": "Digital Vijayanagar", 
       "code": 458, 
       "image": "assets/images/images/hoarding3.jpg", 
       "location": "Vijayanagar" 


      }, 
      { 
       "name": "Digital Vijayanagar", 
       "code": 458, 
       "image": "assets/images/images/hoarding3.jpg", 
       "location": "Vijayanagar" 



      } 
     ] 
}

HTML： -

<div layout="row" layout-align="space-around" layout-padding infinite-scroll='loadMore()' infinite-scroll-distance='2' 
        infinite-scroll-disabled='{{busyLoadingData}}' infinite-scroll-container = "'#content'"> 
<table class="simple"> 
<thead> 
    <tr> 
    <th class="secondary-text"> 
     <div class="table-header"> 
      <span class="column-title">Asset</span> 
     </div> 
    </th> 
    <th class="secondary-text"> 
     <div class="table-header"> 
      <span class="column-title">Location</span> 
     </div> 
    </th> 

    </tr> 
    </thead> 
    <tbody> 
    <tr ng-repeat="assets in items"> 
    <!--| priceRange:slider:lower:upper--> 

    <td>{{assets.name}}</td> 

    <td>{{ assets.location }}</td> 

    </tr> 

</tbody> 
</table> 
</div>

和我的控制器： -

$scope.data = booking.data; 
$scope.busyLoadingData = false; 
$scope.items = []; 
$scope.loadMore = function() { 
//console.log("asdfasdfasd"); 
if($scope.busyLoadingData) 
    return; 
    $scope.busyLoadingData = true; 
    var last = $scope.data[$scope.data.length - 1]; 
    for(var i = 0 ; i <= 5; i++) { 
     $scope.items.push($scope.data[i]); 
     //console.log(last); 
    } 
    $timeout(function(){$scope.busyLoadingData = false; }, 3000); 
};

來源

2016-02-11 Ranjith M

像任何無限滾動元素應該做的，ng-infinite-scroll加載更多的數據，比它可以顯示一次。這是爲了防止減少數據量，並且即使有一些數據仍然讓用戶達到底部。您可以在this demo中清楚地看到效果。它將開始加載數據，即使頁面底部仍留有一些空間。

來源

2016-02-11 14:21:50 AntiHeadshot

ngInfiniteScroll中的一個簡單的錯誤

回答

相關問題