Javascript 带承诺的角度异步上载文件
我是个新手,通过官方网站上的doc我有点困惑 我有控制器,我有服务方法调用:Javascript 带承诺的角度异步上载文件,javascript,angularjs,Javascript,Angularjs,我是个新手,通过官方网站上的doc我有点困惑 我有控制器,我有服务方法调用: uploaderService.addImage(files); 以及该等服务: .service('uploaderService', ['$http', 'settings', function ($http, settings) { var url = undefined; var addImage = function(files){ var fd = new FormData
uploaderService.addImage(files);
以及该等服务:
.service('uploaderService', ['$http', 'settings', function ($http, settings) {
var url = undefined;
var addImage = function(files){
var fd = new FormData();
fd.append("file", files[0]);
$http.post(settings.apiBaseUri + "/files", fd,
{
withCredentials: true,
headers: {'Content-Type': undefined },
transformRequest: angular.identity
})
.success(function (data, status, headers, config) {
url = "temp.jpg";
})
.error(function (err, status) {
console.log('operation failed, status: ' + status);
});
};
var deleteImage = function(){
};
return {
addImage: addImage,
deleteImage: deleteImage
};
我怎么能等到post数据请求完成后再传入url变量位置呢?我试过某某,但有些事情不好,需要帮助)推迟了:
.service('uploaderService', ['$http', '$q', 'settings', function ($http, $q, settings) {
然后在函数中使用它:
var addImage = function(files){
var deferred = $q.defer();
var fd = new FormData();
fd.append("file", files[0]);
$http.post(settings.apiBaseUri + "/files", fd,
{
withCredentials: true,
headers: {'Content-Type': undefined },
transformRequest: angular.identity
})
.success(function (data, status, headers, config) {
url = "temp.jpg";
deferred.resolve(data);
})
.error(function (err, status) {
console.log('operation failed, status: ' + status);
deferred.reject({msg: err});
});
return deferred.promise;
};
然后在控制器中:
uploaderService.addImage(files)
.then(function(data){
// success
var url = data.url; // assuming the returned data of the ajax call contains an url variable
}, function(error){
// error
}).finally(function(){
// always
});
uploaderService.addImage(files).then(function(url) {
console.log('uploaded', url);
}, function(message) {
console.log(message);
});
您需要返回
$http.post(…)
调用的结果,因为它返回一个承诺对象:
var addImage = function (files) {
var fd = new FormData();
fd.append("file", files[0]);
return $http.post(settings.apiBaseUri + "/files", fd, {
withCredentials: true,
headers: {'Content-Type': undefined},
transformRequest: angular.identity
})
.success(function (data, status, headers, config) {
return "temp.jpg";
})
.error(function (err, status) {
return 'operation failed, status: ' + status;
});
};
然后您将在控制器中使用它:
uploaderService.addImage(files)
.then(function(data){
// success
var url = data.url; // assuming the returned data of the ajax call contains an url variable
}, function(error){
// error
}).finally(function(){
// always
});
uploaderService.addImage(files).then(function(url) {
console.log('uploaded', url);
}, function(message) {
console.log(message);
});
您的解决方案或@devqon with deferred哪种做法最好?两种解决方案都有效。但是,带有
$deferred
的是最流行的,因为如果您已经有了承诺,就不需要再创建一个承诺($http.post()
本身就是一个承诺)。