title: Forcing a ng-src reload
body: <p>How can I force angularjs to reload an image with an ng-src attribute, when the url of the image has not changed, but its contents has?</p>
  
  <pre><code>&lt;div ng-controller='ctrl'&gt;
      &lt;img ng-src="{{urlprofilephoto}}"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>An uploadReplace service that performs a file upload, is replacing the content  of the image, but not the url.</p>
  
  <pre><code>app.factory('R4aFact', ['$http', '$q', '$route', '$window', '$rootScope',
  function($http, $q, $route, $window, $rootScope) {
      return {
          uploadReplace: function(imgfile, profileid) {
              var xhr = new XMLHttpRequest(),
                  fd = new FormData(),
                  d = $q.defer();
              fd.append('profileid', profileid);
              fd.append('filedata', imgfile);
              xhr.onload = function(ev) {
                  var data = JSON.parse(this.responseText);
                  $rootScope.$apply(function(){
                      if (data.status == 'OK') {
                          d.resolve(data);
                      } else {
                          d.reject(data);
                      }
                  });
              }
              xhr.open('post', '/profile/replacePhoto', true)
              xhr.send(fd)
              return d.promise;
          }
      }
  }]);
  </code></pre>
  
  <p>When the uploadReplace returns, I don't know how I can force the image to reload</p>
  
  <pre><code>app.controller('ctrl', ['$scope', 'R4aFact', function($scope, R4aFact){
      $scope.clickReplace = function() {
          R4aFact.uploadReplace($scope.imgfile, $scope.pid).then(function(){
              // ??  here I need to force to reload the imgsrc 
          })
      }
  }])
  </code></pre>