title: getting infinite loop when loading images via ajax
body: <p>I'm trying to make user uploaded files private in node.js. And I'm using angular to serve the file in the client side.</p>
  
  <pre><code>&lt;div ng-repeat="message in messages"&gt;
      &lt;div class="details" ng-if="message.type == 'photo'"&gt;
      &lt;img ng-src="{{ chat_ctrl.getPhoto(message.photo, message.conversation_id, message.type) }}"  class="message-photo" alt="{{ message.text }}"&gt;
      &lt;p&gt;{{ message.text }}&lt;/p&gt;
      &lt;small am-time-ago="message.timestamp" am-preprocess="unix"&gt;&lt;/small&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here's the function I'm using to get the file.</p>
  
  <pre><code>    me.getPhoto = function(url, id, message_type){
  
          if(message_type == 'photo'){            
              RequestsService.getPhoto(url, id).then(function(response){
                 console.log(response); //returns the data-uri of the image
                 return response;
              });
          }else{
              return '';
          }
  
      };
  </code></pre>
  
  <p>The function calls the <code>getPhoto</code> method from the <code>RequestService</code> which makes the request to the node.js server:</p>
  
  <pre><code>    function getPhoto(url, id){
  
          var deferred = $q.defer();
  
          var request = {
              method: 'GET',
              url: base_url + '/uploads' + url,
              params: {'url': url, 'id' : id}
          };
  
          $http(request)
              .success(function(response){
                  $timeout.cancel(me.timer);
                  deferred.resolve(response);
              })
              .error(function(data){
                  deferred.reject();  
              });
  
          me.requestTimeout(deferred);
  
          return deferred.promise;        
  
      };
  </code></pre>
  
  <p>Here's the error I'm getting:</p>
  
  <pre><code>Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
  Watchers fired in the last 5 iterations: []
  </code></pre>
  
  <p>The server returns the data-uri representing the image. I already tried using <code>ng-click</code> to call the same method and its returning the data uri fine:</p>
  
  <pre><code>&lt;img src="" ng-click="chat_ctrl.getPhoto(message.photo, message.conversation_id, message.type)"  class="message-photo" alt="{{ message.text }}"&gt;
  </code></pre>
  
  <p>Any ideas?</p>
  
  <p><strong>update</strong> </p>
  
  <p>I tried returning the data I'm getting from the http request directly but I still get the same error.</p>
  
  <pre><code>$http(request)
              .success(function(response){
                  //$timeout.cancel(me.timer);
                  //deferred.resolve(response);
                  return response;
              })
              .error(function(data){
                  return data;
                  //deferred.reject();    
              });
  </code></pre>