当用户单击“导出”按钮时,我试图显示一个加载程序。我创建了一个单独的类来执行此导出功能。

这是我尝试过的代码。

我的问题是加载程序设置为true,但是我不确定导出后如何将其设置为false。

的HTML

<app-loader [showLoader]="showLoader"></app-loader>


ts

import { csvExport } from '../../classes/csvExport';

export class DashboardSpaComponent implements OnInit {
    public csvExport: csvExport = new csvExport();

    // LOADER FLAG
    public showLoader: boolean = false;

    downloadPDF() {
        this.showLoader = true;
        //call class
        this.csvExport.download();

    }
}


csvExport.ts

export class CsvExport {
    download() {
        // code here to do export
    }
}

最佳答案

您需要返回这样的Promise。

export class CsvExport {
    download() {
        return new Promise((resolve, reject) => {
           // code here to do export
           // on completion call this. resolve()
        })
    }
}


并使用这样的下载功能

this.csvExport.download().then(()=>{
    this.showLoader = false;
})


在解决承诺时调用.then(调用resolve函数)
您可以从here了解更多信息

09-11 19:06