Angular 5以自定义格式导出Excel

我正在使用Angular提供的Excel服务。我希望得到如图所示的输出。此格式需要Excel导入

我的组件调用服务获取JSON数据，然后调用Excel服务导出输出。如何自定义函数以获得此输出格式

JSON格式：

[
    {
        "applicationName": "Application1", 
        "migration": "Rehost", 
        "hostname": "DemoVM5", 
        "ipAddress": "10.0.1.7", 
        "operatingSystem": "Microsoft(R) Windows(R) Server 2003, Standard Edition", 
        "migrationStatus": "Failed", 
        "error": null, 
        "runDetails": {
            "rehostCompletedCount": 0, 
            "rehostFailedCount": 2, 
            "refactorCompletedCount": 0, 
            "refactorFailedCount": 0, 
            "runId": 41, 
            "rehostCount": 2, 
            "refactorCount": 0, 
            "status": null, 
            "dateTime": null
        }
    }, 
    {
        "applicationName": "Application1", 
        "migration": "Rehost", 
        "hostname": "DemoVM2", 
        "ipAddress": "10.0.1.6", 
        "operatingSystem": "Microsoft(R) Windows(R) Server 2003, Standard Edition", 
        "migrationStatus": "Failed", 
        "error": null, 
        "runDetails": {
            "rehostCompletedCount": 0, 
            "rehostFailedCount": 2, 
            "refactorCompletedCount": 0, 
            "refactorFailedCount": 0, 
            "runId": 41, 
            "rehostCount": 2, 
            "refactorCount": 0, 
            "status": null, 
            "dateTime": null
        }
    }
]

Excel服务代码

import {
  Injectable
} from '@angular/core';
import * as FileSaver from 'file-saver';
import * as XLSX from 'xlsx';
import * as _ from 'underscore';

const EXCEL_TYPE = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8';
const EXCEL_EXTENSION = '.xlsx';

@Injectable()
export class ExcelService {
  public data: any;
  public sheetName: string = "Sheet1";
  public workbook: XLSX.WorkBook = {
    Sheets: {},
    SheetNames: [],
    Props: {}
  }
  public ws: any;
  public wbout: any;

  constructor() {}

  public exportAsExcelFile(json: any[], excelFileName: string): void {
    this.data = json;
    this.downloadExcel(excelFileName);
  }

  public transformData(data: any) {
    let dataNew: any = [];
    let keys_arr = [];
    _.each(data, function(json) {
      let key: any = json;
      let arr = _.filter(key, function(val, i) {
        let value: any = val;
        let index: any = i;
        keys_arr.push(index);
        if (value == 0) {
          return '0';
        } else {
          return value;
        }
      });
      dataNew.push(arr);
    });
    dataNew.unshift(_.uniq(keys_arr));
    return dataNew;
  }

  public sheet_from_array_of_arrays(data) {
    let ws = {};
    let endCell = {
      c: 10000000,
      r: 10000000
    };
    let startCell = {
      c: 0,
      r: 0
    };
    let range = {
      s: endCell,
      e: startCell
    };

    let wscols = [];

    for (let R = 0; R != data.length; ++R) {
      for (let C = 0; C != data[R].length; ++C) {
        wscols.push({
          wch: 20
        });
        if (range.s.r > R) range.s.r = R;
        if (range.s.c > C) range.s.c = C;
        if (range.e.r < R) range.e.r = R;
        if (range.e.c < C) range.e.c = C;
        let cell = {
          v: data[R][C],
          t: 's',
          s: {}
        };

        if (R === 0) {
          cell.s = {
            "font": {
              "bold": true,
              "sz": 13,
              "alignment": {
                "horizontal": "center",
                "vertical": "center"
              }
            }
          };
        }

        if (cell.v == null) continue;
        let cell_ref = XLSX.utils.encode_cell({
          c: C,
          r: R
        });
        if (typeof cell.v === 'number')
          cell.t = 'n';
        else if (typeof cell.v === 'boolean')
          cell.t = 'b';
        else
          cell.t = 's';
        ws[cell_ref] = cell;
      }
    }
    ws['!cols'] = wscols;

    if (range.s.c < 10000000)
      ws['!ref'] = XLSX.utils.encode_range(endCell, startCell);

    return ws;
  }

  public generateExcelFile(): any {
    this.ws = this.sheet_from_array_of_arrays(this.transformData(this.data));
    this.workbook.SheetNames = [];
    this.workbook.SheetNames.push(this.sheetName);
    this.workbook.Sheets[this.sheetName] = this.ws;
    this.wbout = XLSX.write(this.workbook, {
      bookType: 'xlsx',
      type: 'binary'
    });
    return this.wbout;
  }

  public createView(s: any): ArrayBuffer {
    let buf = new ArrayBuffer(s.length);
    let view = new Uint8Array(buf);
    for (let i = 0; i != s.length; ++i)
      view[i] = s.charCodeAt(i) & 0xFF;
    return buf;
  }

  public downloadExcel(fileName: string): void {
    this.sheetName = fileName + '_export_' + new Date().getTime();
    FileSaver.saveAs(new Blob([this.createView(this.generateExcelFile())], {
      type: "application/octet-stream"
    }), fileName + '_export_' + new Date().getTime() + EXCEL_EXTENSION);
  }
}

导入{
注射的
}从“@angular/core”开始；
从“文件保存程序”导入*作为文件保存程序；
从“XLSX”导入*作为XLSX；
从“下划线”导入*为uu；
const EXCEL_TYPE='application/vnd.openxmlformats-officedocument.spreadsheetml.sheet；字符集=UTF-8'；
常量EXCEL_扩展='.xlsx'；
@可注射（）
出口级服务{
公共数据：任何；
public sheetName:string=“Sheet1”；
公共工作簿：XLSX.workbook={
工作表：{}，
图纸名称：[]，
道具：{}
}
公共服务：任何；
公共wbout：任何；
构造函数（）{}
public exportAsExcelFile（json:any[]，excelFileName:string）：void{
this.data=json；
下载Excel（Excel文件名）；
}
公共数据（数据：任意）{
让dataNew:any=[]；
设键_arr=[]；
_.each（数据、函数（json）{
let key:any=json；
设arr=u.filter（键，函数（val，i）{
let值：any=val；
let索引：any=i；
按键arr.push（索引）；
如果（值==0）{
返回“0”；
}否则{
返回值；
}
});
dataNew.push（arr）；
});
dataNew.unshift（q.uniq（key_arr））；
返回新数据；
}
公共表\u从\u数组\u到\u数组（数据）{
设ws={}；
设endCell={
c:10000000，
r:10000000
};
设startCell={
c:0，
r:0
};
let范围={
s:端细胞，
e:startCell
};
设wscols=[]；
for（设R=0；R！=data.length；++R）{
for（设C=0；C！=data[R]。长度；++C）{
推({
wch:20
});
如果（range.s.r>r）range.s.r=r；
如果（range.s.c>c）range.s.c=c；
如果（范围e.r

对于XLSX库，如果您想在excel中提供任何样式，您需要将其与XLSX样式包一起使用

在这里，您可以找到有关如何应用单元格样式的文档

也是另一个流行且易于使用的客户端excel生成库。该库还提供了比xlsx和xlsx样式更多的样式功能。

---

您可以参考这篇文章。

您可以使用exceljs。它是一个纯开源软件包，而XLSX软件包不是

使用XLSX自定义excel工作表是pro的一项功能

Exceljs是生成xlsx的更好选项

示例代码：

  sheet1.getCell('A1').fill = {
    type: "pattern",
    pattern: "solid",
    fgColor: { argb: "ff1573f4" },
  };
  sheet1.getCell('A1').border = {
    top: { style: "thin" },
    left: { style: "thin" },
    bottom: { style: "thin" },
    right: { style: "thin" },
  };
  sheet1.getCell('A1').font = {
    name: "",
    family: 4,
    size: 11,
    color: { argb: "ffffffff" },
    underline: false,
    bold: true,
  };

---

如果要设置一系列单元格的样式，则可以使用单元格引用数组。单元格样式仅在XLSX的Pro版本中可用。有关更多详细信息，请参阅。使用ExcelJS导出到带有样式的excel。请参阅本文以导出到excel example.XLSX-Style，因为它似乎已不再被使用，使用它很危险。有很多PRs和问题，维护人员没有回答。我尝试使用ExcelJS one，但它导致了很多关于角度材料行为的错误，控制台上没有打印任何内容，因为使用该工具是不可行的。如果其他人在Angular Material+ExcelJS方面有问题并已解决，请与我保持联系，我想使用该库，但目前无法使用