Search code examples
angularexceljs

exceljs giving an error in lines for worksheet.columns = [] array in Angular


When I create a worksheet.columns = [] of data its show me that it is wrong.I am using VSCode and below has all details. Version: 1.52.1 (user setup) Commit: ea3859d4ba2f3e577a159bc91e3074c5d85c0523 Date: 2020-12-16T16:34:46.910Z Electron: 9.3.5 Chrome: 83.0.4103.122 Node.js: 12.14.1 V8: 8.3.110.13-electron.0 OS: Windows_NT x64 10.0.17763

 worksheet.columns = [
  { key: 'QuestionTitle', width: 20 },
  { key: 'RespondedBy', width: 25 },
  { key: 'ResponseDateTime', width: 25 },
  { key: 'Response', width: 50 },
  { key: 'Tag', width: 20 }
];

It seems to me the above is correct. But VScode shows me it's wrong.

enter image description here

Below has the full code.

public exportAsExcelFile(excelData: any[], excelFileName: string, surveyTitle: string, clientDateFormat: string): void {
const workbook = new ExcelJS.Workbook();

workbook.creator = 'My-Team';
workbook.lastModifiedBy = 'SSE';
workbook.created = new Date(2021, 2, 10);
workbook.modified = new Date();
workbook.lastPrinted = new Date();

// Set workbook dates to 1904 date system
workbook.properties.date1904 = true;

const worksheet = workbook.addWorksheet('Responses');

worksheet.mergeCells('A1', 'E2');
worksheet.getCell('C1').value = surveyTitle;

worksheet.getRow(3).values = ['Question Title', 'Responded By', 'Response Date & Time', 'Responses', 'Tags Name'];

worksheet.columns = [
  { key: 'QuestionTitle', width: 20 },
  { key: 'RespondedBy', width: 25 },
  { key: 'ResponseDateTime', width: 25 }, 
  { key: 'Response', width: 50 },
  { key: 'Tag', width: 20 }
];


excelData.forEach(element => {
  console.log("element: ", element);

  if(element.ResponseDateTime != "")
  {
    element.ResponseDateTime = this.datepipe.transform(element.ResponseDateTime, clientDateFormat); 
  }

  const row = worksheet.addRow(element);
  //Make a boarder to data.
  row.eachCell(function (cell) {
    cell.border = {
      top: { style: 'thin' },
      left: { style: 'thin' },
      bottom: { style: 'thin' },
      right: { style: 'thin' }
    };
  })

 

});


workbook.xlsx.writeBuffer().then((buffer: any) => {
  console.log("buffer: ", buffer);
  const data: Blob = new Blob([buffer], { type: EXCEL_TYPE });
  FileSaver.saveAs(data, excelFileName + EXCEL_EXTENSION);
});

}

Any help would be appreciated.


Solution

  • This is a known bug in the exceljs library when used in typescript, you can try this workaround:

    
    ...
    worksheet.columns = [
      { key: 'QuestionTitle', width: 20 },
      { key: 'RespondedBy', width: 25 },
      { key: 'ResponseDateTime', width: 25 }, 
      { key: 'Response', width: 50 },
      { key: 'Tag', width: 20 }
    ] as ExcelJS.Column[];