我有以下angularJS函数通过$ resource获取数据,它可以工作并将此数据推送到vm.data数组,但是当我尝试在控制器中获取vm.data时,我得到null,以下的最后一行代码打印空值
function loadAll() {
Questiongroup.query({}).$promise.then(function(group){
console.log(group);
for(var i=0;i<group.length;i++){
var grouptitle=group[i].title
Question.questionsByQuestionGroup({id:group[i].id}).$promise.then(function(question){
vm.question = question;
for(var j=0;j<question.length;j++){
vm.data.push({ group: grouptitle, question: question[j].question , questiontype: question[j].type });
console.log(vm.data) //this line print correct data
}
});
}
});
}
loadAll();
console.log(vm.data); //This line print null
答案 0 :(得分:2)
上次console.log
打印null
的原因是它在<{>> 赋予.then
方法的函数之前执行。在数据从服务器返回后,.then
服务会调用$q
方法作为参数的函数。
loadAll
函数应返回派生的承诺,可用于在组装后检索vm.data
。这涉及链接承诺并使用$q.all
方法。
function loadAll() {
var topPromise = Questiongroup.query({}).$promise;
var derivedPromise = topPromise.then(function(group){
var promiseList = [];
console.log(group);
for(var i=0;i<group.length;i++){
var itemPromise = getItemPromise(group[i]);
promiseList.push(itemPromise);
};
//return $q.all promise for chaining
return $q.all(promiseList);
});
//return promise
return derivedPromise;
};
然后使用返回的promise。
var loadAllPromise = loadAll();
loadAllPromise.then(function (vmData) {
console.log(vmData);
});
上面的示例演示了如何创建一个promise,它从promises数组中返回一组数据。直观地将其扩展到多个迭代级别是显而易见的。
$q.all
也适用于哈希。function loadAll() {
var topPromise = Questiongroup.query({}).$promise;
var derivedPromise = topPromise.then(function(group){
var promiseHash = {};
console.log(group);
for(var i=0;i<group.length;i++){
var itemPromise = getItemPromise(group[i]);
promiseHash[group[i].id] = itemPromise;
};
//return $q.all promise for chaining
return $q.all(promiseHash);
});
//return promise
return derivedPromise;
};
上面的示例返回一个包含数据哈希(关联数组)的promise。
loadAllPromise.then(function (dataHash) {
console.log(dataHash);
});
来自文档:
所有(许诺);
将多个promises组合成一个promise,当所有输入promise都被解析时解析。
<强>参数强>
承诺的数组或散列。
<强>返回强>
返回将使用值的数组/散列解析的单个promise,每个值对应于promises数组/散列中相同索引/键的promise。如果任何承诺通过拒绝得到解决,则此结果承诺将被拒绝并具有相同的拒绝价值。