同時執行多個Ajax調用，同時進行所有操作，但只有一個等待

Question

所以我有一個頁面同時進行多個ajax調用。每個ajax調用都與塊/ div有關，例如，可以說有5個div。當頁面呈現時，我希望其中一個主div完全加載並在其他div/blocks之前顯示。

Ex。我有一個頁面，頂部有一般信息，其他div是主div的一部分的更多細節。所以他們都應該同時被調用，但是我希望普通div能夠在屏幕上顯示更具體的div之前先加載它的所有內容。

我希望所有的調用是異步的，但不知何故延遲其他人的外觀。這可能嗎？

我明白，async：false只會在調用ajax調用時延遲，但我需要它們全部在同一時間調用。

任何想法？謝謝，麻煩您了。

Answer 1

你可以使用setTimeout（foo，3000）;如果您需要等待特定的時間間隔，請在您的時間間隔後調用您的函數foo（）來執行您想要的操作。

Answer 2

您可以在通用div Ajax調用成功時放置/調用其他Ajax調用。

Answer 3

我想我是通過角度來做的，對我而言，我需要在執行到其他進程之前查詢所有狀態。讓它結合了所有的Ajax請求的數組，然後使用$q.all相當於本地JavaScript的Promise.all()

getAllStatusResult() { 

     let promises = []; 
     let statusList = ['all','done','ongoing','cancelled']; 
     let responseList = []; 
     let date = new Date(), y = date.getFullYear(), m = date.getMonth(); 
     let deferred = $q.defer(); 

     statusList.map(status => { 
     let payload = { 
      start_date: "2017-1-1", 
      end_date: formatDate(date), 
      filter: { status }   
     } 
     promises.push(ReportsService.getRevenues(payload).then((response) => { 
      responseList.push({ name: status, total:response.data.total}); 
     })); 
     }); 


     $q.all(promises).then(() => { 
     deferred.resolve(responseList); 

     }).then(response => { 
     return response; 
     }); 
     return deferred.promise; 

    }