Angularjs $http 和进度条 [英] Angularjs $http and progress bar
问题描述
我需要上传文件并使用 $http(此代码来自我的 .service() 函数):
I need to upload file and I use $http (this code is get from my .service() function):
sendFile: function (params) {
return $http({method : 'post',
url : 'http://XXXXXXXXXXXXX/rest/file.json',
headers : { 'X-CSRF-Token' : $cookies['csrftoken']},
data : params
})
},
现在,对于小文件和好行没有问题,但是对于大文件和/或坏/慢行,UI 存在问题:用户不知道上传何时结束.我需要一个进度条.
Now, for little file and a good line there is no problem, but with a big file and/or a bad/slow line there is a problem of UI: user can not know when upload will be end. I need a progress bar.
所以我在互联网上搜索,但我没有找到解决方案.是否有可能从 $http 获得一些进展/通知?
So I have search on internet, but I have not found a solution. Is there a possibility to get some progress/notification from $http ?
我试过这个代码但没有运气:
I have tried this code without luck:
ProfileService.sendFile(data)
.then(function(ret) {
var uri = ret.data.uri;
scope.content = "Upload finished";
scope.postForm.fid = ret.data.fid;
scope.postForm.buttonDisabled = false;
},
function(error) {
scope.postForm.showError = true;
scope.postForm.errorMsg = error.data;
},
function(progress) {
console.log("inside progress");
console.log(progress)
}
);
progress"函数永远不会被调用.
"progress" function is never called.
我使用的是 angular 1.2.x
I'm using angular 1.2.x
谢谢.
推荐答案
您可以使用 Angular Loading Bar.它为 $http
请求自动工作,除了将其添加为应用程序依赖项外,不需要任何设置.
You can use Angular Loading Bar. It works automatically for $http
requests and does not need any setup except adding it as app dependency.
angular.module('app', ['angular-loading-bar']); // that's all
这篇关于Angularjs $http 和进度条的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!