使用promise为$ .ajax()回调添加其他属性

时间:2016-07-14 07:05:19

标签: jquery ajax

我需要对一个API进行2次调用,每个API都包含一些总数据,然后需要进行迭代。调用1获取两个jsonp对象:

make: Leaving directory `/home/travis/build/IBM-Bluemix/nodejs-MEAN-stack/node_modules/bcrypt/build'

gyp[0m ERR! build error 

gyp ERR! stack Error: `make` failed with exit code: 2

gyp ERR! stack     at ChildProcess.onExit (/home/travis/.nvm/versions/node/v4.4.5/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:276:23)

gyp ERR! stack     at emitTwo (events.js:87:13)

gyp ERR! stack     at ChildProcess.emit (events.js:172:7)

gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:200:12)

gyp ERR! System Linux 3.13.0-63-generic

gyp ERR! command "/home/travis/.nvm/versions/node/v4.4.5/bin/node" "/home/travis/.nvm/versions/node/v4.4.5/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"

gyp ERR! cwd /home/travis/build/IBM-Bluemix/nodejs-MEAN-stack/node_modules/bcrypt

gyp ERR! node -v v4.4.5

gyp ERR! node-gyp -v v3.3.1

gyp ERR! not ok 

npm ERR! Linux 3.13.0-63-generic

npm ERR! argv "/home/travis/.nvm/versions/node/v4.4.5/bin/node" "/home/travis/.nvm/versions/node/v4.4.5/bin/npm" "install"

npm ERR! node v4.4.5

npm ERR! npm  v2.15.5

npm ERR! code ELIFECYCLE

npm ERR! bcrypt@0.8.7 install: `node-gyp rebuild`

npm ERR! Exit status 1

npm ERR! 

npm ERR! Failed at the bcrypt@0.8.7 install script 'node-gyp rebuild'.

npm ERR! This is most likely a problem with the bcrypt package,

npm ERR! not with npm itself.

npm ERR! Tell the author that this fails on your system:

npm ERR!     node-gyp rebuild

npm ERR! You can get information on how to open an issue for this project with:

npm ERR!     npm bugs bcrypt

npm ERR! Or if that isn't available, you can get their info via:

npm ERR! 

npm ERR!     npm owner ls bcrypt

npm mERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:

npm ERR!     /home/travis/build/IBM-Bluemix/nodejs-MEAN-stack/npm-debug.log

调用2使用第一次调用的ID来获取整数。然后我需要相应的"名称"和整数。到目前为止,我有:

[{
    "id": 17,
    "name": "A",
    "campaign_code": "CAP20481"
},{
    "id": 18,
    "name": "B",
    "campaign_code": "CAP20481"
}]

当我注销整个数据数组时,在最后的function getStoreCounts() { var campaignID = $("input[title='Campaign ID']").val(); var storeLists = $.ajax({ type: "GET", dataType: "jsonp", url: "/apiIndex?callback=?&campaign_code=" + campaignID.toString(), }), storeCount = storeLists.then(function(data) { $.each(data,function(i,storeList){ $.extend(storeList,{stores:''}); var getCount = $.ajax({ type: "GET", dataType: "jsonp", url: "/apiStoreCount?callback=?&list_id=" + storeList.id.toString(), }); getCount.done(function(count) { storeList.stores = count; }); }); return data; }); storeCount.done(function(data) { console.log(data); $.each(data,function(i,tierCount){ console.log("Tier: "+tierCount.name); console.log("Stores: "+tierCount.stores); }); }); } 承诺返回时,我得到每个对象的商店值。但是,当我尝试迭代数组中的每个对象时,我错过了存储值。来自Chrome的附加输出。

enter image description here

1 个答案:

答案 0 :(得分:2)

你需要等待所有内心的承诺才能解决。 $.when

storeCount = storeLists.then(function(data) {
    // array of promises       
    var counting = $.map(data,function(storeList){
        $.extend(storeList,{stores:''});
        var getCount = $.ajax({
            type: "GET",
            dataType: "jsonp",
            url: "/apiStoreCount?callback=?&list_id=" + storeList.id.toString(),
        });

        return getCount.then(function(count) {
            storeList.stores = count;
        });

    });
    // wait for all 
    return $.when.apply($, counting).then(function() {
       return data; //return modified data
    })
});

关于命名对话的旁注。您的函数名为getStoreCounts,但返回undefined。让它回到最后的承诺。

function gettingStoreCounts() {
    var campaignID = $("input[title='Campaign ID']").val();
    var storeLists = $.ajax({...}),
    return storeLists.then(...);
}

并在通话方使用结果

gettingStoreCounts().then(/*log, whatever*/)