同時に複数のAjax呼び出しを実行すると、1つを除いてすべてのAjax呼び出しが実行されます。

Question

同時に複数のajax呼び出しを行うページがあります。各Ajaxコールは、取得されたデータを持つブロック/ divに関連しています。たとえば、5つのdivがあるとします。ページがレンダリングされるとき、メインdivの1つが完全にロードされ、他のdivs/blocksの前に表示されます。

Ex。私は一番上に一般的な情報を持っているページを持っています、そして、他のdivsは、メインのdivの一部の詳細です。ですから、同時に呼び出す必要がありますが、一般的なdivの内容を最初にロードしてから、画面上に表示されるdivの表示を許可してください。

私はすべての呼び出しを非同期にしたいが、何とか他の呼び出しの外観を遅らせる。これは可能ですか？

async：falseは、ajax呼び出しが呼び出されたときにのみ遅延することを理解していますが、すべて同時に呼び出す必要があります。

アイデア？どうかありがとうございます。

Answer 1

setTimeout（foo、3000）を使用できます。特定の時間間隔を待つ必要がある場合は、関数foo（）を呼び出して、その時間間隔後に必要な処理を実行します。

Answer 2

一般div Ajax呼び出しが成功すると、他のAjax呼び出しを配置/呼び出すことができます。

Answer 3

私は角度を使って作ったと思います。私のケースでは、他のプロセスに実行する前にすべてのステータスを照会する必要があります。ネイティブの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; 

    }