当视图破坏时,请继续更新进度键



在我的离子2应用中,我使用此功能下载视频文件并跟踪其下载进度:

download()
{
    this.progressbar=true;
    this.downloadbutton=false;
    this.fileTransfer.download('https://...videoURL....mp4', this.file.dataDirectory + 'path/to/downloads/test.mp4').then((entry) => {
        console.log('download complete: ' + entry.toURL());
        this.progressbar=false;
        this.startbutton=true;
    }, (error) => {
        console.log('error');
        console.log(error);
    });
    this.fileTransfer.onProgress(progressEvent => {
        if (progressEvent.lengthComputable) {
            console.log("### Download percentage ###: "+Math.round((progressEvent.loaded / progressEvent.total)*100));
            this.setpercentage((progressEvent.loaded / progressEvent.total) * 100);
        } else {
        }
    });
}

使用setpercentage,我在页面上更新了进度栏

setpercentage(perc) {
        this.loadProgress = Math.round(perc);
        this.ref.detectChanges();
    }

这一切都很好。当用户逐渐消失时,视图被破坏。该视频不断下载(应该是应该的(,但是当我导航返回页面(视频仍在下载时(时,进度键没有更新:该值停留在0%。

即使视图被破坏了,我该如何保持进度栏的更新?

基本上,我想让此page具有与tab相同的功能。当用户在不同的选项卡之间导航时,请记住上一个选项卡的所有内容。

任何帮助都非常感谢!

更新:

以下是该应用程序工作原理的更多信息:

当用户首先导航到页面时,有一个按钮显示"下载电影"。当用户单击它时,调用download()this.progressbar=true;使进度键出现,而this.downloadbutton=false使下载按钮消失了。下载完成后,出现了ProgressBar消失(this.progressbar=false;(,并且出现" Play Movie"按钮(this.startbutton=true;(。问题是,当用户单击下载按钮,然后导航并返回此页面时,似乎所有内容都已重置(尽管电影确实下载(,并且下载按钮为再次显示。

当视图被破坏时,它要么会出现错误或可观察的

完成
 this.fileTransfer.download('https://...videoURL....mp4', 
     this.file.dataDirectory + 'path/to/downloads/test.mp4').then((entry) => {
        console.log('download complete: ' + entry.toURL());
        this.progressbar=false;
        this.startbutton=true;
    }, (error) => {
        this.progressbar=false; //////////////////////////////////
        console.log('error');
        console.log(error);
    });

应在所有可能的操作下更改进度键的状态。

另外,当视图被破坏时

实现ngOnDestroy()生命周期挂钩处理同一情况

ngOnDestroy(){
      this.progressbar=false; ////////
}

更新1:

下载方法的语法如下

fileTransfer.download(
    sourceURL,
    targetURL,
    successcallback,
    errorCallBack,
    trustAllHosts,
    options)

源,目标,成功的回背,错误拨动是强制性参数

docs

根据语法更新该方法。

相关内容

  • 没有找到相关文章

最新更新