显示使用 cordova 文件传输下载的百分比

Question

我可以使用以下脚本将文件下载到设备。我想知道的是能够在视图中显示下载的百分比。

downloadImage() {

    this.platform.ready().then(() => {

      const fileTransfer: FileTransferObject = this.Transfer.create();

      const audiolocation = `http://myweb.com/files`+this.audio_download;

      fileTransfer.download(audiolocation, this.storageDirectory+'downloads').then((entry) => {
        const alertSuccess = this.alertCtrl.create({
          title: `Download Succeeded!`,
          subTitle: `Audio was successfully downloaded to: ${entry.toURL()}`,
          buttons: ['Ok']
        });

        alertSuccess.present();

      }, (error) => {

        const alertFailure = this.alertCtrl.create({
          title: `Download Failed!`,
          subTitle: `was not successfully downloaded. Error code: ${error.code}`,
          buttons: ['Ok']
        });

        alertFailure.present();

      });

    });

  }

Answer 1

文件传输有onProgress方法。参考这个链接

var fileTransfer= new FileTransfer();

fileTransfer.onprogress = function(progressEvent) {
    var percent =  progressEvent.loaded / progressEvent.total * 100;
    percent = Math.round(percent);
    console.log(percent);
};

//fileTransfer.download(...); // or fileTransfer.upload(...);

希望这有帮助。

Answer 2

更多类似的东西：

fileTransfer.onProgress((progressEvent) => {
    var percent =  progressEvent.loaded / progressEvent.total * 100;
    this.percentage = Math.round(percent);
    console.log(this.percentage);
});

Answer 3

.ts文件：

  const fileTransfer: FileTransferObject = this.transfer.create();

  fileTransfer.onProgress((progressEvent: ProgressEvent): void => {
    this.uploadStatus = Math.floor(progressEvent.loaded / progressEvent.total * 
    100);
    console.log("Upload Progress () => ", this.uploadStatus);
    console.log("progressEvent.loaded ", progressEvent.loaded);
    console.log("progressEvent.total ", progressEvent.total);
  });

.html文件：

<ion-row>
  <ion-label class="upload-video-label"> Progress... {{uploadStatus}}%
  </ion-label>
</ion-row>