如何在函数中实现 Observable答案

【问题标题】：How to implement Observable in function如何在函数中实现 Observable
【发布时间】：2019-12-27 02:20:54
【问题描述】：

根据 luwojtaszek 在本主题中的回答： How to Export JSON to CSV or Excel - Angular 2 我实现了一段代码：

  public exportAsExcelFile(json: any[], excelFileName: string): void {
    const worksheet: XLSX.WorkSheet = XLSX.utils.json_to_sheet(json);
    const workbook: XLSX.WorkBook = {Sheets: {'data': worksheet}, SheetNames: ['data']};
    XLSX.writeFile(workbook, ExcelService.toExportFileName(excelFileName));
  }
}

以上代码运行良好，最终生成了一个 excel 文件。由于数据的大小，生成一个文件需要几秒钟（几乎 10 MB）。我想展示一些精美的动画来通知用户，它正在进行中。问题是我无法返回 observable，或者我不知道如何正确使用它。

我创建了一个通过构造函数注入的服务，然后以这种方式订阅函数：

this.loading = true;      
return this._excelExporterService.exportAsExcelFile(this.data,'file').subscribe(x=> {
    if(x)
    this.loading = false;
})

这就是我的服务的样子：

  public exportAsExcelFile(json: any[], excelFileName: string): Observable<boolean> {
    const worksheet: XLSX.WorkSheet = XLSX.utils.json_to_sheet(json);
    const workbook: XLSX.WorkBook = {Sheets: {'data': worksheet}, SheetNames: ['data']};
    let x: boolean;
    XLSX.writeFile(workbook, ExcelExporterService.toExportFileName(excelFileName));
    return Observable.of(true);

  }

【问题讨论】：

为 exportAsExcelFile 函数添加等待并返回 XLSX.writeFile 怎么样;;公共异步 exportAsExcelFile ... return XLSX.writeFile(workbook....} this._excelExporterService.exportAsExcelFile(this.data,'file').then(d =>{ this.loading = false }).catch(e= >{})
编辑了答案以包含替代方案。

标签： javascript angular

【解决方案1】：

在服务中
import { of } from 'rxjsx; 在功能中：
返回（真）;`

【讨论】：

【解决方案2】：

documentation 你可以使用：

public exportAsExcelFile(json: any[], excelFileName: string): Observable<boolean> {
    return new Observable((obs)=> { 
        const worksheet: XLSX.WorkSheet = XLSX.utils.json_to_sheet(json);
        const workbook: XLSX.WorkBook = {Sheets: {'data': worksheet}, SheetNames: ['data']};
        obs.next(true);
        XLSX.writeFileAsync(excelFileName, workbook, () => {
            obs.next(false);
        });
    });
}
exportAsExcelFile(json_any, 'testName').subscribe((resp:boolean)=>{
    loadind(resp);
});

【讨论】：

似乎缺少 writeFileAsync。你能提供完整的例子吗？