jquery 多个带有承诺的 http get 请求

Question

我正在尝试使用 jquery get 从服务器获取多个图像。

 $.each(result.Data.Files, function (i, v) {

        $.get('/mobile/image?path=' + v, function (res) {

            if (res.Success) {
                $('#images-container').append(`<img alt="Image Title" src="${res.Image}">`);
            }
        });

    });

添加所有图像后，我想调用一个 jquery 插件来处理这些图像。
我如何使用 promise 来做到这一点？
我尝试了类似的东西：

     $.when(
            $.each(result.Data.Files, function (i, v) {
                $.get('/mobile/image?path=' + v);
            })
        ).then(function () {

            $("#images-container").image_plugin();

            for (var i = 0; i < arguments.length; i++) {

                let src = arguments[i];
                console.log(src)
            }



        });

但我在 then 部分得到的只是网址，而不是实际的 base64 响应
谢谢

Answer 1

使用Deferred

var defs = [];

//create Deferred for each item in array and push to defs array
$.each(result.Data.Files, function () {
    defs.push($.Deferred());
});

$.when.apply($, defs).then( function(v){
    //runs when all deferred are resolved
    $("#images-container").image_plugin(); 
    console.log(v)
});

$.each(result.Data.Files, function (i, v) {
     $.get('/mobile/image?path=' + v, function (res) {
        if (res.Success) {
            $('#images-container').append(`<img alt="Image Title" src="${res.Image}">`);
            defs[i].resolve(res.Image);
            //resolve i'th deferred
        }
    });
});