title: Reload image in Angular
body: <p>I'm trying to reload an image from my webserver every n seconds. The code below drags the new picture, but it doesn't replace the old one in the client. Where is my mistake?</p>
  
  <pre><code>&lt;div ng-app="refresh-div" ng-controller="refresh_control"&gt;
      &lt;img ng-src="{{imageUrl}}" /&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
      var app = angular.module('refresh-div', [])
          .controller('refresh_control', function ($scope, $http, $timeout) {
              $scope.imageURL = 'assets/now.png?_ts=' + new Date().getTime();
  
              $scope.getData = function () {
                  $http.get($scope.imageURL, {
                      cache: false
                  }).success(function (data, status, headers, config) {
                      $scope.image = data;
                      $scope.imageUrl = "http://mywebsite/assets/now.png";
                  });
              };
  
              $scope.intervalFunction = function () {
                  $timeout(function () {
                      $scope.getData();
                      $scope.intervalFunction();
                  }, 1500)
              };
  
              $scope.intervalFunction();
          });
  &lt;/script&gt;
  </code></pre>