在异步循环功能角承诺 [英] Angular promise in async loop function
本文介绍了在异步循环功能角承诺的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有哪些循环通过选定的文件，并将它们添加服务器文件系统上的上传功能。
上传工厂
app.factory（'uploadFactory'，函数（$上传，$ Q）{ 变种uploadFactory = {}; VAR图像= {
楷模： []，
图片：[]，
uploadImages：功能（）{
变种延迟= $ q.defer（）;
对于（VAR I = 0; I＆LT; this.Models.length;我++）{
变量$文件= this.Models [I] .file;
（函数（指数）{
$上传
.upload（{
网址：/ API /上传/
方法：POST，
文件：$文件
}）
.success（功能（数据，结果）{
//添加返回的文件数据模型
VAR imageObject = {
路径：data.Path，
说明：image.Models [指数]。说明，
摄影师：image.Models [指数] .Photographer
};
image.Images.push（imageObject）; defer.resolve（结果）;
}）;
}）（一世）;
}
返回defer.promise;
}
}; uploadFactory.image =功能（）{
返回形象;
}; 返回uploadFactory;
}）;
在我的控制器
$ scope.imageUpload =新uploadFactory.image;
$ scope.create =功能（）{
变种uploadImages = $ scope.imageUpload.uploadImages（）;
uploadImages.then（函数（）
$ scope.ship.Images = $ scope.imageUpload.Images;
shipFactory.create（$ scope.ship）.success（successPostCallback）.error（errorCallback）;
}）;
};
我的问题是，承诺只适用于通过循环第一次上传的承诺。我读过一些关于 $ q.all（），但我不知道如何实现它的工作。
我怎样才能使它通过整个循环持有？谢谢！
解决方案
VAR图像= {
楷模： []，
图片：[]，
uploadImages：功能（）{
对于（VAR I = 0; I＆LT; this.Models.length;我++）{
变量$文件= this.Models [I] .file;
变种延迟= $ q.defer（）; （函数（指数）{
VAR承诺= $上传
.upload（{
网址：/ API /上传/
方法：POST，
文件：$文件
}）
.success（功能（数据，结果）{
//添加返回的文件数据模型
VAR imageObject = {
路径：data.Path，
说明：image.Models [指数]。说明，
摄影师：image.Models [指数] .Photographer
};
image.Images.push（imageObject）; defer.resolve（结果）;
}）;
promises.push（承诺）;
}）（一世）;
}
返回$ q.all（承诺）;
}
};
解决方案
您说得对 $ q.all（）是去这里的方式（没有经过测试的 - - 但我认为这至少是朝着正确的方向..）：
app.factory（'uploadFactory'，函数（$上传，$ Q）{ 变种uploadFactory = {}; VAR图像= {
楷模： []，
图片：[]，
uploadImages：功能（）{ VAR承诺= []; 对于（VAR I = 0; I＆LT; this.Models.length;我++）{ 变量$文件= this.Models [I] .file;
VAR响应= $上传
.upload（{
网址：/ API /上传/
方法：POST，
文件：$文件
}）
.success（功能（数据，结果）{
//添加返回的文件数据模型
VAR imageObject = {
路径：data.Path，
说明：$ file.Description，
摄影师：$ file.Photographer
};
image.Images.push（imageObject）;
}）; promises.push（响应）;
}
返回$ q.all（承诺）;
}
}; uploadFactory.image =功能（）{
返回形象;
}; 返回uploadFactory;
}）;
I have an upload function which loops through the selected files and adds them on the servers file system.
Upload factory
app.factory('uploadFactory', function ($upload, $q) {
var uploadFactory = {};
var image = {
Models: [],
Images: [],
uploadImages: function () {
var defer = $q.defer();
for (var i = 0; i < this.Models.length; i++) {
var $file = this.Models[i].file;
(function (index) {
$upload
.upload({
url: "/api/upload/",
method: "POST",
file: $file
})
.success(function (data, result) {
// Add returned file data to model
var imageObject = {
Path: data.Path,
Description: image.Models[index].Description,
Photographer: image.Models[index].Photographer
};
image.Images.push(imageObject);
defer.resolve(result);
});
})(i);
}
return defer.promise;
}
};
uploadFactory.image = function () {
return image;
};
return uploadFactory;
});
In my controller
$scope.imageUpload = new uploadFactory.image;
$scope.create = function () {
var uploadImages = $scope.imageUpload.uploadImages();
uploadImages.then(function ()
$scope.ship.Images = $scope.imageUpload.Images;
shipFactory.create($scope.ship).success(successPostCallback).error(errorCallback);
});
};
My problem is that the promise only holds the promise for the first upload through the looping. I have read something about $q.all() but I'm not sure how to implement it to work.
How can I make it to hold through the whole loop? Thanks!
Solution
var image = {
Models: [],
Images: [],
uploadImages: function () {
for (var i = 0; i < this.Models.length; i++) {
var $file = this.Models[i].file;
var defer = $q.defer();
(function (index) {
var promise = $upload
.upload({
url: "/api/upload/",
method: "POST",
file: $file
})
.success(function (data, result) {
// Add returned file data to model
var imageObject = {
Path: data.Path,
Description: image.Models[index].Description,
Photographer: image.Models[index].Photographer
};
image.Images.push(imageObject);
defer.resolve(result);
});
promises.push(promise);
})(i);
}
return $q.all(promises);
}
};
解决方案
You're right $q.all() is the way to go here (totally untested -- but i think this is at least the right direction..):
app.factory('uploadFactory', function ($upload, $q) {
var uploadFactory = {};
var image = {
Models: [],
Images: [],
uploadImages: function () {
var promises = [];
for (var i = 0; i < this.Models.length; i++) {
var $file = this.Models[i].file;
var response = $upload
.upload({
url: "/api/upload/",
method: "POST",
file: $file
})
.success(function (data, result) {
// Add returned file data to model
var imageObject = {
Path: data.Path,
Description: $file.Description,
Photographer: $file.Photographer
};
image.Images.push(imageObject);
});
promises.push(response);
}
return $q.all(promises);
}
};
uploadFactory.image = function () {
return image;
};
return uploadFactory;
});
这篇关于在异步循环功能角承诺的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
