Angular4 导出Excel文件

96 阅读 0 评论 64 点赞

我是靠谱客的博主大意镜子，最近开发中收集的这篇文章主要介绍Angular4 导出Excel文件，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

*.ts

把json数据导出到Excel文件

import * as FileSaver from 'file-saver';
import * as XLSX from 'xlsx';
exportAsExcelFile() {
let json = [{
"姓名": "***", "工號": "***", "英文名": "***", "部门": "**", "性别": "1", "手机": "+861**********", "个人邮箱": "****@**.com"
}];
const worksheet: XLSX.WorkSheet = XLSX.utils.json_to_sheet(json);
const workbook: XLSX.WorkBook = { Sheets: { 'data': worksheet }, SheetNames: ['data'] };
const excelBuffer: any = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
this.saveAsExcelFile(excelBuffer, "模板");
}
private saveAsExcelFile(buffer: any, fileName: string) {
const data: Blob = new Blob([buffer], {
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8'
});
FileSaver.saveAs(data, fileName + '_export_' + new Date().getTime() + '.xlsx');
}

使用http服务下载Excel文件到本地

import { Http } from '@angular/http';
constructor(
private http: Http
) { }
exportService(){
let downloadUrl= `../../assets/模板.xls`;
return this.http.get(downloadUrl,{responseType:3}).map(res => {
return res;
});
}
exportAsExcelFile() {
this.exportService().subscribe(res => {
// let res=res.json();可能要转化类型
var blob = new Blob([res.json()], {
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
});
var objectUrl = URL.createObjectURL(blob);
var a = document.createElement('a');
document.body.appendChild(a);
a.setAttribute('style', 'display:none');
a.setAttribute('href', objectUrl);
a.setAttribute('download', '模板.xlsx');
a.click();
document.body.removeChild(a);
//释放URL地址
URL.revokeObjectURL(objectUrl);
});
}