从http调用获取img数据的正确方法

Question

我有service来获取所有用户个人资料图片。问题是img只会在请求完成/完成时显示。

我想要的是显示已被调用/加载的img。

getImgService

uploadService.getImgs().then(function (data) {
    vm.img = data;
    myCache.put('imgsData', vm.img);
    return vm.img;
});

我已经尝试研究我的问题，发现预加载，但找不到我可以关注的文章。

Answer 1

让你的getImgs()返回承诺数组而不是一个承诺。数组中的每个promise都应该返回单个图像数据。通过该修改，您需要为所有返回的promises注册相同的回调，以便它对每个图像加载的事件做出反应并立即缓存它。例如：

function cacheImage(data) {
    if (!vm.img) {
        vm.img = []; // assuming array store of single image data
        myCache.put(‘imgsData’, vm.img);
    }
    vm.img.push(data); // add to array next image data
}

uploadService.getImgs().forEach(imgPromise => imgPromise.then(cacheImage));