Comment gérer plusieurs appels Ajax appelant la même fonction?

Question

Salut avoir 4 directives sur la page, toutes les directives exigent la liste des utilisateurs. La liste d'utilisateurs est stockée dans une base de données nécessitant une requête hhtp. Comme la directive 4 figure sur la page en même temps, 4 appels ajax différents ont été envoyés au serveur pour une réponse similaire.

Ensuite, la réponse est mise en cache.

Ce qui peut être fait que toutes les 4 directives reçoivent sa liste d'utilisateurs et qu'un seul ajax est envoyé au serveur.

code directive intérieur (auto est ce) (ajaxCallService est le service)

ajaxCallService.getUser(function(response) { 
       self.users = response; 
       //Next operations 
}); 

service ajaxCallService

Variable 
var userList = [] 

Method 
if (!userList.length) { 
      $http.post({ 
       url: #, 
       data:# 
      }) 
      .then(
       function(response) { 
         userList = response.allMembers; 
         callback && callback(userList); 
       } 
      ); 
     }else{ 
      callback && callback(userList); 
     } 

Comment puis-je éviter 4 appels ajax et seulement faire 1 appel et laisser les autres 3 attente pour la réponse et passer la réponse en arrière?

Answer 1

Vous pouvez utiliser des promesses pour cela, pour voir s'il est déjà en cours d'exécution. Les services étant des singletons en mode angulaire, vous savez qu'il s'agit toujours d'une instance partagée:

var userList = []; 
var promise; 

function getUser() { 
    // inject the $q service 
    var deferred = $q.defer(); 

    if (userList.length) { 
     // already got data, immediately resolve that one 
     deferred.resolve(userList); 
    } 

    if (promise) { 
     // a promise is already working on it, return this one 
     return promise; 
    } else { 
     $http.post(...).success(function(response) { 
      userList = response; 
      deferred.resolve(response); 
     }); 
    } 

    // if this point is reached, this is the first call 
    // assign the promise so other calls can know this one is working on it 
    promise = deferred.promise; 
    return promise; 
}