目前我面前有一个巨大的 if-then-else 循环,它首先从网络服务中获取多个 cantinas。然后它获取所有可用的餐点(针对每个菜单)和所有可用的配菜(针对每个菜单)。然后,它会检查每一餐及其配菜中的所有添加剂并汇总它们。
最后我有多个菜单,包括正餐、配菜和所有添加剂。
下面的流程图展示了这个过程:
我想美化代码并想利用 jQuery 的 promise - 但我不知道该怎么做,因为我必须在 when 之后堆叠
(至少我认为,也许我必须then
解决
?)。以下是我的最佳尝试:
//this totally does not work at all, but you get the idea what I want to do
Menus.getCantinas()
.when(Menus.getMeals(cantinas), Menus.getSides(cantinas)) //when doesn't exist here, neither does cantinas
.then(Menus.getAdditives(meals, sides) //also throws errors as meals and sides does not exist
.done(function(cantinas, meals, sides, additives) { //more errors for the people
Menus.cantinas = cantinas;
Menus.meals = meals;
Menus.sides = sides;
Menus.additives = additives;
//... some html stuff to build the menus
});
请务必查看以下代码片段以获得更多解释性代码。
window.Menus = {
cantinas = {},
meals = {},
sides = {},
additives = {},
callWebservice: function (listname, filter)
{
if (filter && filter != '')
data['$filter'] = filter;
return jQuery.ajax({
url: '/_api/web/lists/getbytitle(\'' + listname + '\')/items',
data: data,
dataType: 'json'
});
},
getCantinas: function() {
return Menus.callWebservice("Cantinas", "");
},
getMeals: function(cantinas) {
var filterString;
for (var i = 0; i < cantinas.length; i++) {
if (i == 0) {
filterstring = "ID eq " + cantinas[i];
}
else {
filterstring += " or ID eq " + cantinas[i]
}
}
return Menus.callWebservice("Meals", filterString);
},
getSides: function(cantinas) {
//see above function for filterstuff
return Menus.callWebservice("Sides", filterString);
},
getAdditives: function(meals, sides) {
for (var i = 0; i < meals.length; i++) {
if (i == 0 && !meals) {
filterstring = "ID eq " + meals[i];
}
else {
filterstring += " or ID eq " + meals[i]
}
}
for (var i = 0; i < sides.length; i++) {
if (i == 0 && !sides) {
filterstring = "ID eq " + sides[i];
}
else {
filterstring += " or ID eq " + sides[i]
}
}
return Menus.callWebservice("Additives", "");
}
Init: function() {
//this totally does not work at all, but you get the idea what I want to do
Menus.getCantinas()
.when(Menus.getMeals(cantinas), Menus.getSides(cantinas))
.then(Menus.getAdditives(meals, sides)
.done(function(cantinas, meals, sides, additives){
Menus.cantinas = cantinas;
Menus.meals = meals;
Menus.sides = sides;
Menus.additives = additives;
//... some html stuff to build the menus
});
}
}
Menus.Init()
我希望我说得有道理?如何使用 promises 和级联参数从一个到下一个,基本上如何使上述语句起作用并为我提供包含多种餐点、配菜和添加剂的多个菜单。
最佳答案
就像评论说的那样,$.when
是一个免费的功能。如果我们使用 then
able 链接,我们可以在这里获得非常干净的语法。
Menus.getCantinas().then(function(cantinas){ // `then` is how we chain promises
Menus.cantinas = cantinas;
// if we need to aggregate more than one promise, we `$.when`
return $.when(Menus.getMeals(cantinas), Menus.getSides(cantinas));
}).then(function(meals, sides){ // in jQuery `then` can take multiple arguments
Menus.sides = sides; // we can fill closure arguments here
Menus.meals = meals;
return Menus.getAdditives(meals, sides); // again we chain
}).then(function(additives){
Menus.additives = additives;
return Menus; // we can also return non promises and chain on them if we want
}).done(function(){ // done terminates a chain generally.
// edit HTML here
});
关于javascript - jQuery 链接和级联然后是什么时候,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27533826/