Javascript 如何添加进度条

Javascript 如何添加进度条,javascript,ng-file-upload,Javascript,Ng File Upload,我刚开始使用ng file upload,开始时有点复杂,但经过一段时间的阅读,我可以实现一些事情。但是现在我一直在尝试添加一个进度条,我正在将图片上传到Firebase,效果很好,我可以保存它,更新它并在视图上显示图片,现在我只需要添加一个进度条就可以知道上传时发生了什么 我知道做这件事的信息和一些例子在那里,但我无法找到如何添加到我的代码,希望你能帮我一把 以下是我的Javascript代码: $scope.submit = function(file) { Auth.$o

我刚开始使用
ng file upload
,开始时有点复杂,但经过一段时间的阅读,我可以实现一些事情。但是现在我一直在尝试添加一个进度条,我正在将图片上传到Firebase,效果很好,我可以保存它,更新它并在视图上显示图片,现在我只需要添加一个进度条就可以知道上传时发生了什么

我知道做这件事的信息和一些例子在那里,但我无法找到如何添加到我的代码,希望你能帮我一把

以下是我的Javascript代码:

$scope.submit = function(file) {

        Auth.$onAuth(function(authData){
        $scope.authData = authData;

            if(authData){
                if ($scope.file) {

                    console.log($scope.file);

                    var refImg = new Firebase("http://url.firebaseio.com/users/" + authData.uid);

                    Upload.base64DataUrl($scope.file).then(function(base64Urls) {
                        refImg.update({
                        FotoPerfil : base64Urls
                        });
                    });
                }    
            }
            else{
                window.location.href = '#/Bienvenidos';
            }
        });
    };
和我的HTML:

<div class="btn btn-default" ngf-select ng-model="file" name="file" ngf-pattern="'image/*'" accept="image/*" ngf-max-size="2MB" ngf-min-height="100">Select picture profile</div>

<button class="btn btn-success" style="float:right;" ng-click="submit()">Save</button>  

<img src="{{perfil.FotoPerfil}}" ngf-no-object-url="true" />
选择图片配置文件
拯救
非常感谢


Daniel

将firebase存储与firebase 3.0一起使用如何?

您正在使用firebase上载文件的base64数据url。因此,您必须查看Firebase是否提供任何功能,以便能够侦听进度事件。如果没有,那么替代方法是使用Upload.http()。