Javascript 异步加载图像

当选择给定选项时，我有多个图像文件需要加载。 默认情况下，已加载图像

选择该选项后，我只想在图像完全加载后更改图像

为此，我正在执行一个

$http.get

请求，如下所示：

$http.get('/public/images/city/amsterdam.jpg').success(function (data, status, headers, config) {
    // data loaded
});

---

加载数据后，我想将其分配给

或作为

背景图像

。如何使用angularjs或javascript实现这一点？

您可以使用javascript

---

这似乎是一种奇怪的方式。这是为了在加载图像时节省资源吗？您可以使用

$scope

变量来处理要显示的图像，并在

标记上使用

ng if

来切换

元素？我使用style=“background image:url（）”来显示默认图像。只有当新图像完成加载时，才会将其替换为新图像，以便元素永远不会没有图像。图像大小约为500-600 KB。

var myImage = new Image();
myImage.onLoad = function(){
    // data loaded
    // do stuff here, then apply so angular knows.
    $scope.$apply();
};
myImage.src = '/public/images/city/amsterdam.jpg';