How to achieve Import Excel using npm-xlsx in Shared Service?

The below code works for reading imported Excel data using npm-xlsx package and version is 0.14.0.

ExcelService:

 public async importAsXLSX(file : File) {
    var workbook =  await this.getWorkbookFromFile(file);
    return new Promise<any>((resolve, reject) => {
      var worksheet = workbook.Sheets[workbook.SheetNames[0]];     
      this.excelData =XLSX.utils.sheet_to_json(worksheet, 
       {header:1,raw:true,defval:''});
        resolve(this.excelData);
      });
    }

    public async getWorkbookFromFile(inputFile: File) {
      return new Promise<XLSX.WorkBook>((resolve, reject) => {
        var reader = new FileReader();
        reader.onload = (event: any) => {
              var data = event.target.result;
              var workbook = XLSX.read(data, { type: 'binary' });
              resolve(workbook);
          };
        reader.readAsBinaryString(inputFile);
      });
   }

And then call the above ExcelService in the required component.

This code works for me with xlsx version 0.16.2. and it should also work with the current version 0.16.5.

readEntries(url: string, sheetName: string, rowCount: number): Promise < Object[] > {
  return new Promise < Object[] > ((resolve, reject) => {
    return fetch(url)
      .then(r => r.blob())
      .then(b => this.read(b))
      .then(data => {
        const workbook = XLSX.read(data, {
          type: 'binary',
          sheetRows: rowCount,
          cellDates: true,
          cellText: false
        });
        const sheet = workbook.Sheets[sheetName];
        if (!sheet) {
          reject('Worksheet "' + sheetName + '" does not exist');
        }
        resolve(XLSX.utils.sheet_to_json(sheet));
      });
  });
}

For further details, please have a look at the class ExcelReader from the open source project koia.

• npm i file-saver
• npm i xlsx

Create a service with the following methods

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';



 public exportAsExcelFile(report:string, 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(report,excelBuffer, excelFileName);
  }


  private saveAsExcelFile(reportName:string,buffer: any, fileName: string): void {
    const data: Blob = new Blob([buffer], { type: EXCEL_TYPE });
    FileSaver.saveAs(data + fileName + EXCEL_EXTENSION);
  }

Call this method in any component you want.

this.excelService.exportAsExcelFile("filename","filenameagain", "data that has to be...");

// Update for upload

  fileUpload = (data)=> {

let fileUploaded = data.target.files[0];
const dummyFunc = ()=>{
  // call some function here 
 }
// Get The File From The Input
var oFile = data.target.files[0];
var sFilename = oFile.name;
// Create A File Reader HTML5
var temp_array = [];

var reader = new FileReader();

// Ready The Event For When A File Gets Selected
reader.onload = function (e) {

   var data = (<FileReader>e.target).result;
   var cfb = XLSX.read(data, {
    type: 'binary'
  });

  var oJS = XLSX.utils.sheet_to_json(cfb.Sheets[cfb.SheetNames[0]], {
    // blankRows: false,
    header: ["Give some name here"],   //This will be the header name

  });
  oJS.shift();
  for (let i = 0; i < oJS.length; i++) {
    temp_array.push(oJS[i]["Give some name here"]

    if (i == oJS.length - 1) {
      dummyFunc(temp_array)        // To call some function after upload is done.
    }
  }

}
reader.readAsBinaryString(oFile);

}