title: In AngularJS, how do I automatically update a value fetched via ajax?
body: <p>I want to make a function which fetches some info from an ajax URL. E.g in my service, I would have the following method:</p>
  
  <pre><code>this.getFavColor = function(id)
  {
      return $http.get('/colors/get/' + id);
  }
  </code></pre>
  
  <p>And in my controller, I would do the following:</p>
  
  <pre><code>$scope.favColor = UserService.getFavColor( id );
  </code></pre>
  
  <p>The problem however is, <code>$scope.favColor</code> will be assigned a promise in this case, and the only way to actually change it to the value returned by ajax, is to set a <code>.success()</code> callback on the promise and use it to update the value.</p>
  
  <p>However, this is quickly becoming cumbersome if I have a lot of things that have to be fetched via ajax. Is there any shortcut, such as may be doing this?</p>
  
  <pre><code>this.getFavColor = function(id, variableToChange)
  {
      return $http.get('/colors/get/' + id).success(function(jsonResult)
         {
           variableToChange = jsonResult.favColor;
         });
  }
  </code></pre>
  
  <p>And then doing the following in the controller:</p>
  
  <pre><code>UserService.getFavColor( id, $scope.favColor );
  </code></pre>
  
  <p>Will this method actually work?</p>
  
  <p><strong>Note: I've already considered <code>$resource</code> but I cannot set up a REST api for my ajax, so please don't suggest it.</strong></p>