Angular to Excel

Question

I'm trying to export some JSON data from my Angular to Excel. I already did it successfully. My problem is how would i include the headings to the excel also? I can only export the table but not the headings? Please see the link and codes below

CLICK HERE

CODE

public exportAsExcelFile(json: any[], excelFileName: string): void {

    const worksheet: XLSX.WorkSheet = XLSX.utils.json_to_sheet(json);
    console.log('worksheet',worksheet);
    const workbook: XLSX.WorkBook = { Sheets: { 'data': worksheet }, SheetNames: ['data'] };
    const excelBuffer: any = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
    //const excelBuffer: any = XLSX.write(workbook, { bookType: 'xlsx', type: 'buffer' });
    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);
  }

PIC

Siddhartha Gupta · Accepted Answer · 2019-08-23 07:03:25Z

1

You need to add the following code once your have created your sheets

XLSX.utils.sheet_add_json(worksheet, [
    { A: '', B: '', C: ''},
], { header: ['A', 'B', 'C'], skipHeader: true, origin: -1 });
this.sheetHeaders(worksheet);

Updated stackblitz

Updated stackblitz 2

edited Aug 23, 2019 at 7:03

answered Aug 23, 2019 at 3:49

Siddhartha Gupta

1,1588 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Joseph Over a year ago

It should create a row above the table headers. Yours is overriding the Eid, Ename, Esal @Siddhartha Gupta

Siddhartha Gupta Over a year ago

Oops! Misinterpreted your question... Please look at update stackblitz

Joseph Over a year ago

Thanks a lot but one more thing. I need to put value in headings like this for example Name: 'Joseph', Age: 10, Gender: 'Male'. Thank you

Siddhartha Gupta Over a year ago

can you paste a sample excel example

Siddhartha Gupta Over a year ago

This seems to be a completely different task from initial question. Still I've added a new stackblitz for you. In future post a new question... Thanks

Collectives™ on Stack Overflow

Angular to Excel

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related