title: How do I create a angular js service that makes a http request only once
body: <p>I have the following angularjs service </p>
  
  <pre><code>var assetLookUpTransformService = function($http, $q) {
  this.data = null;
  var self = this;
  
  this.doStuff = function() {
  
      var defer = $q.defer();
  
      if (self.data) {
          defer.resolve(self.data[0].DisplayName);
      } else {
          $http({
              url: '../AssetLookup/GetAssetLookUp',
              method: "GET"
          }).success(function(response) {
              self.data = response;
              defer.resolve(self.data[0].DisplayName);
          });
      }
          return defer.promise;
      }
  }
  </code></pre>
  
  <p>It works ok, in that once the $http request has returned all subsequent calls to "doStuff" return data from data rather than make a new request. </p>
  
  <p>Then problem I have is that I am making a bunch of calls right after each other on page load. And what is happening is that the first call to doStuff will make an $http request, but also any calls to dostuff that happen before the first http request returns will also make a $http request. </p>
  
  <p>Is there a way to make the calls to doStuff "wait" for the outstanding $http request to return before making there own. </p>
  
  <p>Or is there a way to ensure the $http request only ever happens once?</p>