Reading the xlsx file using excelJS in Angular

Question

I want to read a source file, edit it and then sent it to the user to download it. But I can't read the source file from the project. Here is an implementation of file reading in excelJS that I am using:

import {FormArray, FormControl, FormGroup, Validators} from '@angular/forms';
import { Component, OnInit} from '@angular/core';
import * as ExcelJS from "exceljs/dist/exceljs.min.js";


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})

export class AppComponent implements OnInit {
  form: FormGroup
  stepCounter: number
  itemCounter: number
  data: dataInterface

  ngOnInit() {
    this.form = new FormGroup({
      companyName: new FormControl('', Validators.required),
      items: new FormArray([])
    })
    this.data = {}
    this.itemCounter = 0
    this.stepCounter = 1
    this.addItem()
    let workbook: ExcelJS.Workbook = new ExcelJS.Workbook();
    workbook.xlsx.readFile('/src/assets/sourceWorkbook.xlsx')
      .then(function() {
        console.log('Done!')
        console.log(workbook)
      });
  }

Also to add excelJS module I've added a string to angular.json:

"scripts": [
              "node_modules/exceljs/dist/exceljs.min.js"
            ]

The thing is that I've always got an error like this:

ERROR Error: "Uncaught (in promise): TypeError: i.constants is undefined
exists/<@http://localhost:4200/vendor.js:62894:86961
ZoneAwarePromise@http://localhost:4200/polyfills.js:973:33
exists@http://localhost:4200/vendor.js:62894:86936
e/<@http://localhost:4200/vendor.js:62894:383830
u@http://localhost:4200/vendor.js:62908:149223
s/o._invoke</<@http://localhost:4200/vendor.js:62908:148977
y/</e[t]@http://localhost:4200/vendor.js:62908:149580
n@http://localhost:4200/vendor.js:62894:382317
s@http://localhost:4200/vendor.js:62894:382521
i/</<@http://localhost:4200/vendor.js:62894:382580
ZoneAwarePromise@http://localhost:4200/polyfills.js:973:33
i/<@http://localhost:4200/vendor.js:62894:382460
./node_modules/exceljs/dist/exceljs.min.js/</<[135]</</O</n<.value<@http://localhost:4200/vendor.js:62894:384180
ngOnInit@http://localhost:4200/main.js:579:23
callHook@http://localhost:4200/vendor.js:10960:18
callHooks@http://localhost:4200/vendor.js:10924:25
executeInitAndCheckHooks@http://localhost:4200/vendor.js:10865:18
refreshView@http://localhost:4200/vendor.js:17228:45
renderComponentOrTemplate@http://localhost:4200/vendor.js:17336:20
tickRootContext@http://localhost:4200/vendor.js:18805:34
detectChangesInRootView@http://localhost:4200/vendor.js:18839:20
detectChanges@http://localhost:4200/vendor.js:20479:46
tick@http://localhost:4200/vendor.js:45046:22
_loadComponent@http://localhost:4200/vendor.js:45096:14
bootstrap@http://localhost:4200/vendor.js:45022:14
_moduleDoBootstrap/<@http://localhost:4200/vendor.js:44635:25
_moduleDoBootstrap@http://localhost:4200/vendor.js:44631:44
bootstrapModuleFactory/</</<@http://localhost:4200/vendor.js:44586:26
invoke@http://localhost:4200/polyfills.js:377:30
onInvoke@http://localhost:4200/vendor.js:43769:33
invoke@http://localhost:4200/polyfills.js:376:36
run@http://localhost:4200/polyfills.js:136:47
scheduleResolveOrReject/<@http://localhost:4200/polyfills.js:870:40
invokeTask@http://localhost:4200/polyfills.js:412:35
onInvokeTask@http://localhost:4200/vendor.js:43747:33
invokeTask@http://localhost:4200/polyfills.js:411:40
runTask@http://localhost:4200/polyfills.js:180:51
drainMicroTaskQueue@http://localhost:4200/polyfills.js:582:39

My file is located here: /src/assets/sourceWorkbook.xlsx

score 0 · Answer 1 · answered Dec 12 '21 at 10:27

0

I get the same error when trying to read a xlsx file. Works great when loading an uploaded file, using the function load instead of readFile.

answered Dec 12 '21 at 10:27

Denis Menacai

1

As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Dec 12 '21 at 10:28
This does not really answer the question. If you have a different question, you can ask it by clicking [Ask Question](https://stackoverflow.com/questions/ask). To get notified when this question gets new answers, you can [follow this question](https://meta.stackexchange.com/q/345661). Once you have enough [reputation](https://stackoverflow.com/help/whats-reputation), you can also [add a bounty](https://stackoverflow.com/help/privileges/set-bounties) to draw more attention to this question. - [From Review](/review/late-answers/30567534) – George Sun Dec 13 '21 at 22:52

Reading the xlsx file using excelJS in Angular

1 Answers1