title: How to Get Values from a Service that Returns Promises in AngularJS
body: <p>I am trying to call a service method in a controller. Here is my code.  ROAService.js: </p>
  
  <pre><code>return{
      loadROAValues:function(userId,roaId){
          var params=JSON.stringify({userId:userId,roaId:roaId});
          var promise =$http.post(url+'/'+'getROAItems',params).success(function(data)   {  
              roaDetails = data;
              $log.debug("values in service class");
              $log.debug("values in ROA");
              $log.debug(roaDetails.id);
              return roaDetails
          })
          .error(function(data){
          roaDetails = 'error';
          return roaDetails;
          });
          return promise;
      }
  }
  </code></pre>
  
  <p>In controller ROA Controller:</p>
  
  <pre><code>$scope.getCurrentROA = function(roaObj){
      currentROA = ROAService.loadROAValues($scope.getMemberId(),roaObj.id).then(function(response) {
         console.log(response);
      }).catch(function(response) {
         console.log("failure", response);
      });
      $log.debug("ROA id in controller class is:"+currentROA.id);
  };
  </code></pre>
  
  <p>I am getting the following the output:</p>
  
  <pre><code>ROA id in controller class is :undefined
      values in service class
      values in ROA
      386. 
  </code></pre>
  
  <p>ROA id from controller is printing before service call completes.It might be a race condition. How to keep controller wait until promise return? How to fix this race condition?</p>