如何以角度8将对象数组导出到excel答案

【问题标题】：How to export array of objects to an excel in angular 8如何以角度8将对象数组导出到excel
【发布时间】：2020-11-21 04:59:04
【问题描述】：

我有一个如下所示的对象数组

studentData = [
    {
      names: ["jhon", "deo"],
      ages: [19, 20],
      address: ["pattan", "baramulla"],
      subjects: ["Eng", "Math", "Science"],
      emails: ["jeo@email.com", "deo@email.com"]
    }
  ]

如何将这些数据导出到 Excel 并下载。

【问题讨论】：

标签： angular

【解决方案1】：

安装此模块：https://www.npmjs.com/package/file-saver

创建一个共享服务：

excel.service.ts

import { Injectable } from '@angular/core';
import * as fileSaver from 'file-saver';
import * as XLSX from 'xlsx';
const EXCEL_TYPE = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8';
const EXCEL_EXTENSION = '.xlsx';
@Injectable()
export class ExcelService {
constructor() { }
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'] };
  const excelBuffer: any = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
  this.saveAsExcelFile(excelBuffer, excelFileName);
}
private saveAsExcelFile(buffer: any, fileName: string): void {
   const data: Blob = new Blob([buffer], {type: EXCEL_TYPE});
   fileSaver.saveAs(data, fileName + '_export_' + new  Date().getTime() + EXCEL_EXTENSION);
}
}

组件.ts

excelService.exportAsExcelFile(excelJsonData, 'sample');

您必须将数据转换为以下格式：

studentData = [
    {
      names: "jhon",ages: 19, address: pattan,subjects: Eng,emails:"jeo@email.com"
    },
 {
      names: "doe",ages: 20, address: usa,subjects: Math,emails:"doe@email.com"
    }
  ]

您可以使用以下函数进行转换：

convertData() {
    let elemCount;
    let finalData = [];
    for (const [key, value] of Object.entries(this.studentData[0])) {
      console.log(key, value);

      elemCount = value.length;

      for (let i = 0; i < elemCount; i++) {
        if (!finalData[i]) {
          finalData[i] = {
            names: "",
            ages: "",
            address: "",
            subjects: "",
            emails: ""
          };
        }
        finalData[i][key] = value[i];
      }
    }
    console.log(finalData);
    return finalData;
  }

https://stackblitz.com/edit/angular6-export-xlsx-balbt5?file=src/app/app.component.html

【讨论】：

能否请您轻松地将数据转换为您建议的格式，因为我的 API 仅提供这种格式的数据
可以在 API 端进行更改。
无法更改 API 端
上面我给出的对话方法使用那个

【解决方案2】：

你可以试试这个json格式

excel.service.ts

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

const EXCEL_TYPE = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8';
const EXCEL_EXTENSION = '.xlsx';
@Injectable()
export class ExcelService {

constructor() { }

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'] };
    const excelBuffer: any = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
    this.saveAsExcelFile(excelBuffer, excelFileName);
}

【讨论】：