Forcing a ng-src reload

Question

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?

Answer 1

An easy workaround is to append a unique timestamp to ng-src to force image reload as follows:

$scope.$apply(function () {
    $scope.imageUrl = $scope.imageUrl + '?' + new Date().getTime();
});

or

angular.module('ngSrcDemo', [])
    .controller('AppCtrl', ['$scope', function ($scope) {
    $scope.app = {
        imageUrl: "http://example.com/img.png"
    };
    var random = (new Date()).toString();
    $scope.imageSource = $scope.app.imageUrl + "?cb=" + random;
}]);