Jessica Illy Jessica Illy - 1 month ago 20
AngularJS Question

cache image using angularjs without plugin

<img src="http://assets.example.com/static/thumb_{{selected}}.jpg"/>


my selected model is dynamic, I can load the img proper but how to cache every single photo because I notice there's a delay when I apply new value to
selected
.

Answer

The easiest way would be to do it in your controller:

angular.module('app').controller('myController', function(images) {
    var preload = {};
    angular.forEach(images, function(image, i) {
        preload[i] = new Image()
        preload[i].src = "http://assets.example.com/static/thumb_" + image + ".jpg";
    });
});