如何在上传文件时添加进度栏

  • 本文关键字:添加 文件 angular ionic2
  • 更新时间 :
  • 英文 :


我正在将文件传输到URL,我可以成功地做到这一点,但是我不知道如何获得上传的文件的进度,我需要在某些数字中获得进度

 fileTransfer.upload(file_path, api_endpoint, options, data)
                                .then((data) => {
                                    // success 
                                     console.log("success", JSON.parse(data['response']));
                                    this.upload_success();
                                }, (err) => {
                                    // error 
                                    this.failed_upload();
                                    console.log('File failed uploaded.', err);
                                })

我在ionic2文档中找到了OnProgress(侦听器)检查我不知道该怎么使用可以给我一些示例

更新了经过Doc https://github.com/apache/cordova-plugin-file-transfer#example-with-upload-headers-and-progress-progress-events-events-events-events-events-events-and-and-and-os-ofly

fileTransfer.onProgress = function(progressEvent) {
    if (progressEvent) {
        console.log("progress success =====")
    } else {
        console.log("progress error =====")
    }
};     

如果运行,我看不到任何这些控制台,我将在文件传输代码下方添加了此新代码。有人可以帮助我

您可以通过使用像这样的OnProgress函数显示

public   fileTransfer: TransferObject = this.transfer.create();
public upload(path,folder) 
{
  url="http://www.axmag.com/download/pdfurl-guide.pdf";
  var trustHosts = true;
  this.presentLoading("Loading");
  //**Progress Bar**
  this.fileTransfer.onProgress((e)=>
  {
    let prg=(e.lengthComputable) ?  Math.round(e.loaded / e.total * 100) : -1;  
    console.log("progress:"+prg);
  });
  this.fileTransfer.upload(file_path, api_endpoint, options, data).then((entry) => {
//handle success        
console.log('upload complete: ' );
  },
  (error) => {
    this.loader.dismiss();
    alert('uploading faild: ');
    console.log(error);
  //handle error
  });
}

现在您可以调用upload()函数上传文件

相关内容

  • 没有找到相关文章

最新更新