Angularjs ui-utils ui-scroll如何使用

Question

我不確定如何使用ui-scroll。我創建了一個plunker，但我認爲它不能正常工作，因爲它不會在滾動時添加或刪除DOM中的項目。它顯示所有！

My Plunker for ui-scroll

MyApp.controller('MyAppCtrl', function($scope) { 
    $scope.myData = { 
     get : function(index, count, success) { 
    var result = [{"guid":"8544a1c7-d637-42ae-836a-8a71901b44ca"},{"guid":"aff1450c-b4dd-4aa0-9b12-ea097e72c6fa"},{"guid":"a1c68796-7a28-4721-904a-4944234e253e"},{"guid":"8b7d881f-20ea-4b6c-a8d6-772e1236e6bf"},{"guid":"398c50a7-885e-4455-b741-66ebc2a64060"},{"guid":"81557a60-60b5-425a-9839-cf1da7e21bde"},{"guid":"ed48be4e-5963-47a1-b872-2bf20bec5da3"},{"guid":"15d9fa95-f824-4bd9-8b75-afb8dec99f03"},{"guid":"eaf2e5aa-24a4-4995-82d5-e661efc64556"}]; 

     index = 1; 
     count = 10; 

     success(result); 
     } 
    }; 
}); 

我看着在Github上幾個例子，但大部分代碼是在咖啡腳本，它只是在一個循環的DOM添加項目。我的問題是，如果你已經有正確的數據，你如何添加項目。我是否仍然遍歷數據集？

非常感謝您的幫助。

Answer 1

UI-Scroll讓你知道基於索引和計數返回到成功回調函數的結果。像這樣的東西應該與工作

get: function(index, count, success){ 
     var result = [{"guid":"8544a1c7-d637-42ae-836a-8a71901b44ca"},{"guid":"aff1450c-b4dd-4aa0-9b12-ea097e72c6fa"},{"guid":"a1c68796-7a28-4721-904a-4944234e253e"},{"guid":"8b7d881f-20ea-4b6c-a8d6-772e1236e6bf"},{"guid":"398c50a7-885e-4455-b741-66ebc2a64060"},{"guid":"81557a60-60b5-425a-9839-cf1da7e21bde"},{"guid":"ed48be4e-5963-47a1-b872-2bf20bec5da3"},{"guid":"15d9fa95-f824-4bd9-8b75-afb8dec99f03"},{"guid":"eaf2e5aa-24a4-4995-82d5-e661efc64556"}];   
     success(result.slice(index-1, index-1 + count)); 
} 

請注意，您是通過指數是非零因此基於當你與你必須使用是從零開始的一個索引的數組（因此指數 - 工作1）。此外，您可能需要考慮將結果保留在get函數之外，並讓get函數返回要傳遞給UI-Scroll的模型的一部分。

Answer 2

扎克有一點，但是，不僅限於第四，但背部滾動索引，以及，你必須通過索引之前做到這一點，算成功：

index = index <= 0 ? index + 1 : index -1; 

IE，所得到的代碼應該看起來像這樣：

get: function(index, count, success) { 
    var result = [ 
     {"guid":"8544a1c7-d637-42ae-836a-8a71901b44ca"},{"guid":"aff1450c-b4dd-4aa0-9b12-ea097e72c6fa"}, 
     {"guid":"a1c68796-7a28-4721-904a-4944234e253e"},{"guid":"8b7d881f-20ea-4b6c-a8d6-772e1236e6bf"}, 
     {"guid":"398c50a7-885e-4455-b741-66ebc2a64060"},{"guid":"81557a60-60b5-425a-9839-cf1da7e21bde"}, 
     {"guid":"ed48be4e-5963-47a1-b872-2bf20bec5da3"},{"guid":"15d9fa95-f824-4bd9-8b75-afb8dec99f03"}, 
     {"guid":"eaf2e5aa-24a4-4995-82d5-e661efc64556"} 
    ]; 
    index = index <= 0 ? index + 1 : index -1; 
    success(result.slice(index, index + count)); 
}