對於有大量圖像的頁面的角度（1）分頁

Question

我有一個頁面顯示大量大圖像，當用戶單擊下一個按鈕時，我從數組中獲取下一批大圖像。在點擊下一頁按鈕之前，我怎樣才能加載下一頁圖像（從谷歌雲存儲中獲取）？ 目前下一頁加載非常緩慢，因爲角等待所有要加載的圖像。

示例代碼：

控制器功能：

$scope.nextImage = function() { 
    $scope.index += 1; 
    $scope.images = images[$scope.index] 
} 

HTML：

<img ng-src="images[0]" /> 
<img ng-src="images[1]" /> 
<img ng-src="images[2]" /> 
.... 

Answer 1

您需要正確的設置當前

後預載你的下一個圖像列表

$scope.nextImage = function() { 
    $scope.index += 1; 
    $scope.images = images[$scope.index]; 
    if($scope.index < MAX_IMAGE_LIST_COUNT) {  
    $scope.isLoading = true; 
    preload(images[$scope.index + 1]); 
    } 
} 

哪裏preload()是像（基於this，但你可以搜索其他方式）

function preload(imageArray, index) { 
    index = index || 0; 
    if (imageArray && imageArray.length > index) { 
    var img = new Image(); 
    img.onload = function() { 
     preload(imageArray, index + 1); 
    } 
    img.src = images[$scope.index + 1][index]; 
    return; 
    } 
    $scope.isLoading = false; 
} 

我還添加了isLoading標誌觀看負荷procces。