漸進滾動angularjs

Question

我有一個數據庫女巫包含1000個產品。我有一個列表，一次顯示10個產品。這個網格是可滾動的。我想加載10個產品10. 用angularjs做這件事的最好方法是什麼？我正在尋找一種需要最短代碼的方法。 謝謝

Answer 1

這個概念被稱爲分頁，如果你想在較少的時間內實現這一點，那麼你必須去任何可用的模塊。

我已經使用Infinite Scroll它非常易於使用，並且可以幫助您在任何時候實施。

Answer 2

您正在尋找稱爲「無限滾動」的庫。您可以在這裏找到這個程序https://github.com/ifwe/infinite-scroll

凡在控制器，你把這個代碼：

var app = angular.module('MyApp', ['tagged.directives.infiniteScroll']); 
app.controller('MainController', ['$scope', '$http', function($scope, $http) { 
    $scope.page = 1; 
    $scope.items = []; 
    $scope.fetching = false; 

    // Fetch more items 
    $scope.getMore = function() { 
    $scope.page++; 
    $scope.fetching = true; 
    $http.get('/my/endpoint', { page : $scope.page }).then(function(items) { 
     $scope.fetching = false; 
     // Append the items to the list 
     $scope.items = $scope.items.concat(items); 
    }); 
    }; 
}]); 

這是你的看法：

<div ng-app="MyApp"> 
    <div ng-controller="MainController"> 
    <ul tagged-infinite-scroll="getMore()"> 
     <li ng-repeat="item in items"> 
     {{ item.title }} 
     </li> 
    </ul> 
    </div> 
</div> 

一旦檢測到您滾動是在結束它會調用函數來加載新項目的ng-repeat項目。請記住添加到端點限制和偏移來加載其餘數據，而不是每次都是相同的數據。