頁面加載發生在通過xhr以角度返回的數據之前

我們在加載從S3中獲取的文檔網址並在儀表板選項卡頁面上顯示縮略圖時面臨挑戰。頁面加載發生在通過xhr以角度返回的數據之前

/***fetch docs **push success confirm***/ 
    $scope.getdocuments = function(){ 
     DDListDataService.getDocumentTypes().then(function(docs){ 
      $scope.docTypes = docs.data; 
     }); 

     userService.fetchUserDocs($scope.user.customerId,$scope.user.entityType).then(function(userDocs){ 

      //console.log("result--"+userDocs); 

      angular.forEach(userDocs, function(object , key){ 
       console.log(object); 
       var xhr = new XMLHttpRequest(); 
       var blob; 
       xhr.open('GET', object.documents[0].documentUrl); 
       //var file = common.base64ToBlob(object.d, true); 
       xhr.responseType = 'arraybuffer'; 

       xhr.onload = function(e) { 

        //var file = remoteToBlob(object.documents[0].documentUrl); 
        //var file = common.base64ToBlob(object.documents[0].document, 'image/jpg'); 
        /*file.lastModifiedDate = new Date(); 
        file.name = "";*/ 

        var file = new Blob([this.response], {type: 'image/jpg'}); 
        //rest of the code that uses the blob goes here 

        file.lastModifiedDate = new Date(); 
        file.name = ""; 

        //setTimeout(function(){console.log(file)},1000); 

        var options = { 
          customerId : $scope.user.customerId, 
          customerType : $scope.user.entityType, 
          docTypeName : object.key.documentName, 
          documentName : object.key.documentNameId, 
          documentVersion : object.key.documentVersion, 
          documentUID : object.doccumentUID, 
          //requestedBy : $scope.user.customerType, 
          requestedBy : LocalService.get('userType'), 
          requestedById : $scope.user.customerId 

        } 

        var fileItem = new FileUploader.FileItem($scope.uploader,file,options); 
        fileItem.progress = 100; 
        fileItem.isUploaded = true; 
        fileItem.isSuccess = true; 

        /*file.customerId = $scope.user.customerId; 
        file.customerType =$scope.user.entityType; 
        file.documentName = object.key.documentNameId; 
        file.documentVersion =object.key.documentVersion; 
        file.documentUID = object.doccumentUID; 
        file.requestedBy = $scope.user.customerId; 
        file.requestedById = $scope.user.customerId;*/ 

        $scope.uploader.queue.push(fileItem); 
        console.log(fileItem); 
       }; 
       xhr.send(); 
      }); 
     }); 
     //$scope.uploader.formData=[{"user":angular.json($scope.user)}]; 
     $scope.uploader.queue.length = 0; 
     }

的xhr.send()執行後頁面加載發生，但數據仍然沒有準備好，它給的數據是不是在平均時間返回undefined文件對象。我們如何才能放大負載直到數據被返回？ onload我相信有一個回調應該執行的功能。糾正我，如果錯了。
這怎麼處理？
HTML以顯示圖像是

<div ng-show="uploader.isHTML5" ng-thumb="{ file: item._file, height: 100 ,stream:item._file}"></div>

來源

2016-08-05 coderunner

你爲什麼不使用AJAX角語法？ – madalinivascu

新的angular.Could你只是解釋它將如何工作的角度，它會解決我們面臨的問題？ @madalinivascu – coderunner

您應該使用由角提供的** $ http **服務[請參閱此處的示例]（https://docs.angularjs.org/tutorial/step_07）。 –

需要的頁面加載是獨立的需要爲您XHR請求完成的時間。

因此，創建調用另一個函數window.load功能，並把你的其他功能裏面的XHR請求這樣以後需要什麼：

$(window.load(function(){ 
afterXHRLoad(); //This calls the afterXHRLoad function after the page loads 
}); 

function afterXHRLoad(){ 
if($.active == 0) 
{ 
//code needed here; 
} 
else 
{ 
setTimeout(afterXHRLoad, 1000); //recursively call the function after 1 second 
} 
}

來源

2016-08-05 13:10:13

謝謝你的回覆@Mr。鯨魚會嘗試一下並讓你知道。 – coderunner

頁面加載發生在通過xhr以角度返回的數據之前

回答

相關問題