angular数据导出

1、HTML按钮

<button nz-button nzType="primary" (click)="exportData()">导出</button>

2、js部分
 

//导出数据
  exportData(){
      this.nzLoading = true
      this.pledgeSearch.page.pageNum = this.pageNum
      let urls = [ 
        environment.permission.purchase.findPurchaseExport,
        environment.permission.purchase.findTransferExport,
        environment.permission.purchase.findReleaseExport
      ];
      let url = urls[this.businessType - 1] ;
      this.httpService.findPost(url,this.pledgeSearch, {responseType: "blob",timeout:30000}).subscribe((res: PageRes<PurchaseList>) => {
        this.nzLoading = false ;
        this.download(res) ;
    })
  }
  
 download(data : any){
    const contentType = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
    const blob = new Blob([data], { type: contentType });
    const url = window.URL.createObjectURL(blob);//将blob类型的url放在内存中

    // 以动态创建a标签进行下载
    const a = document.createElement("a");
    a.href = url;

    let names =['主动申购记录','被动划转记录','释放明细记录']
    let name = names[this.businessType-1]

    a.download = name; //文件名
    a.click();

    //释放内存,移除元素
    window.URL.revokeObjectURL(url);
    document.body.removeChild(a);
  }

总结:

1、将responseType声明为blob

2、多个数据时通过数组下标取到对应数据 
 

猜你喜欢

转载自blog.csdn.net/Mjxiaomihu/article/details/127412077