angular prevent calling a function who made promise on multiple webservice until it finish
<p>I'm using angular 1.4.1</p>

<ol>
<li><p>I use two webservices from a server ( i cannot edit them )</p>

<ul>
<li><code>/institutions</code> who return me a list of institutions with ids</li>
<li><code>/institution/XXX/collections/</code> ( with XXX is a institution id) who return me the collections of the current institution</li>
</ul></li>
<li><p>I create a service function (<code>getInstitutions()</code>) who use this webservices to get all the data about institutions and there sub collections :</p>

<pre><code> var singleton_institutions = null ; 
 this.getInstitutions = function(){
       var getHrefCollections = function(links){
         for(var l in links){ if(links[l]["rel"] == "collections"){ return links[l]["href"]; }}
         return null ;
      };
      if(singleton_institutions != null){
         // don't reload the data if already loaded
         return $timeout( function(){
            return singleton_institutions ;
         }, 0);
      }else {
         var institutions = [];
         var url = $rootScope.api + "institutions";
         return $http({
            method: 'GET',
            url: url
         }).then(
             // we have the institutions list, now get each sub collections
             function successCallback(response) {
                institutions = response.data;
                var promises = [];
                for (var i in response.data) {
                   var url = getHrefCollections(response.data[i]["links"]);
                   promises.push( //Push the promises into an array
                       $http({
                          method: 'GET',
                          url: url
                       }).then(function successCallback(response) {
                           return response.data;
                       })
                   );
                }
                return $q.all(promises); // Resolve all promises before going to the next .then
             },
             function errorCallback(response) {
                console.log(response);
             }
         ).then(
             function (resultArray) {
                // formating the data
                for (var i in resultArray) {
                   institutions[i]["collections"] = resultArray[i];
                   institutions[i]["institutionname"] = tools_getInstitutionName(institutions[i]["institutioncode"]);
                }
                singleton_institutions = institutions;
                return singleton_institutions ;
             },
             function (error) {
                console.log(error);
             }
         );
      }
   };
</code></pre></li>
<li><p>The problem : </p></li>
</ol>

<p>In my service function i make a chained promise with $q, this work good, it take few seconds because it launch approximatly 30 https call (one per institution).</p>

<p>In the application initialization, this function are called twice in approximatly the same time. 
So the first call don't have time to finish and to init <code>singleton_institutions</code> before the second call so i have 60 http's call instead of half.</p>

<pre><code>//call from a controller A
services.getInstitutions().then(function (institutions) {...}); // take few seconds to load the datas
//call from a controller B in near the same time
services.getInstitutions().then(function (institutions) {...}); // so this will make all the data load again because the first call is not finished
</code></pre>

<ol start="4">
<li>QUESTION : </li>
</ol>

<p>How to prevent <code>services.getInstitutions()</code> to get the data if another call is not finished yet. </p>