循环中的承诺如何处理数据?
How to deal the data when the promise in a loop?
这是我的方式:
var activeArr = [];
var activeDate = [];
var day = (endDate - startDate) / (24 * 60 * 60 * 1000);
for (var i = 1; i < day + 1; i++) {
activeDate.push(endDate - (24 * 60 * 60 * 1000) * i);
var start = endDate - (24 * 60 * 60 * 1000) * i;
var end = endDate - (24 * 60 * 60 * 1000) * (i - 1);
statisService.getRegStatis(start, end).then(function(data) {
activeArr.push(data);
if(activeArr.length == day){
var active = [];
for(var j=0;j<activeArr.length;j++){
var obj = {};
obj.date = activeDate[j];
obj.data = activeArr[j].data;
active.push(obj);
}
$scope.active = active;
}
});
}
服务:
userServiceModule.factory('statisService', ['$http', 'serverUrl', function($http, serverUrl) {
return {
getRegStatis: function(startDate, endDate) {
var url = serverUrl + "/adminDA/dbReport?startTime=" + startDate + "&endTime=" + endDate;
return $http.get(url).then(function(result) {
return result.data;
});
}
};
我想把日期和数据放到一个对象中,这样我就可以像这样在视图中使用它:
<tr ng-repeat="item in active track by $index">
for循环不会等待所有服务调用完成,所以我在for循环中处理数据,我认为这不是一个好方法,但我不知道该怎么做更好。
您应该使用 $q.defer() promise 管理器,来自 deferred API。
$q.defer() 得到 2 个方法 :
resolve(value) :通过给她最终值
来解决我们相关的承诺
reject(reason) :解决承诺错误。
此外$q.all()以一个promises数组为参数,全部解析。
控制器
(function(){
function Controller($scope, Service, $q) {
var promises = [];
var defer = $q.defer();
//Process loop
for (var i = 0; i < 20; ++i){
//Fill my promises array with the promise that Service.post(i) return
promises.push(Service.post(i));
}
//Resolve all promise into the promises array
$q.all(promises).then(function(response){
//Create arr by maping each data field of the response
var arr = response.map(function(elm){
return elm.data;
});
//Resolve my data when she is processed
defer.resolve(arr);
});
//When the data is set, i can get it
defer.promise.then(function(data){
//Here data is an array
console.log(data)
});
}
angular
.module('app', [])
.controller('ctrl', Controller);
})();
服务
(function(){
function Service($http){
function post(num){
//Just an example, I've pass an object, and just return it then
return $http.post('path_to_url', {id:num});
}
var factory = {
post: post
};
return factory;
}
angular
.module('app')
.factory('Service', Service);
})();
这是我的方式:
var activeArr = [];
var activeDate = [];
var day = (endDate - startDate) / (24 * 60 * 60 * 1000);
for (var i = 1; i < day + 1; i++) {
activeDate.push(endDate - (24 * 60 * 60 * 1000) * i);
var start = endDate - (24 * 60 * 60 * 1000) * i;
var end = endDate - (24 * 60 * 60 * 1000) * (i - 1);
statisService.getRegStatis(start, end).then(function(data) {
activeArr.push(data);
if(activeArr.length == day){
var active = [];
for(var j=0;j<activeArr.length;j++){
var obj = {};
obj.date = activeDate[j];
obj.data = activeArr[j].data;
active.push(obj);
}
$scope.active = active;
}
});
}
服务:
userServiceModule.factory('statisService', ['$http', 'serverUrl', function($http, serverUrl) {
return {
getRegStatis: function(startDate, endDate) {
var url = serverUrl + "/adminDA/dbReport?startTime=" + startDate + "&endTime=" + endDate;
return $http.get(url).then(function(result) {
return result.data;
});
}
};
我想把日期和数据放到一个对象中,这样我就可以像这样在视图中使用它:
<tr ng-repeat="item in active track by $index">
for循环不会等待所有服务调用完成,所以我在for循环中处理数据,我认为这不是一个好方法,但我不知道该怎么做更好。
您应该使用 $q.defer() promise 管理器,来自 deferred API。
$q.defer() 得到 2 个方法 :
resolve(value) :通过给她最终值
来解决我们相关的承诺
reject(reason) :解决承诺错误。
此外$q.all()以一个promises数组为参数,全部解析。
控制器
(function(){
function Controller($scope, Service, $q) {
var promises = [];
var defer = $q.defer();
//Process loop
for (var i = 0; i < 20; ++i){
//Fill my promises array with the promise that Service.post(i) return
promises.push(Service.post(i));
}
//Resolve all promise into the promises array
$q.all(promises).then(function(response){
//Create arr by maping each data field of the response
var arr = response.map(function(elm){
return elm.data;
});
//Resolve my data when she is processed
defer.resolve(arr);
});
//When the data is set, i can get it
defer.promise.then(function(data){
//Here data is an array
console.log(data)
});
}
angular
.module('app', [])
.controller('ctrl', Controller);
})();
服务
(function(){
function Service($http){
function post(num){
//Just an example, I've pass an object, and just return it then
return $http.post('path_to_url', {id:num});
}
var factory = {
post: post
};
return factory;
}
angular
.module('app')
.factory('Service', Service);
})();