18397

Reading local Excel file with js-xlsx using Angular 9?

<h3>Question</h3>

I have my Angular-CLI frontend development server running locally on localhost:4200

For specific reasons I need to get a local Excel file stored on my PC, read its content and make some calls to an API. And it must be from the client side.

I'm trying to use js-xlsx, got it installed with npm install xlsx but I can't find how to get the file and read its content.

<blockquote>

How can I import a local excel file with js-xlsx in Angular 9?

</blockquote>

Note: <em>If it is possible/easier using pure JavaScript it is also valid for me.</em>


<h3>Answer1:</h3>

Here is working Example

onFileChange(ev) { let workBook = null; let jsonData = null; const reader = new FileReader(); const file = ev.target.files[0]; reader.onload = (event) => { const data = reader.result; workBook = XLSX.read(data, { type: 'binary' }); jsonData = workBook.SheetNames.reduce((initial, name) => { const sheet = workBook.Sheets[name]; initial[name] = XLSX.utils.sheet_to_json(sheet); return initial; }, {}); const dataString = JSON.stringify(jsonData); document.getElementById('output').innerHTML = dataString.slice(0, 300).concat("..."); this.setDownload(dataString); } reader.readAsBinaryString(file); }
<h3>Answer2:</h3>

In my case i want data like

<blockquote>

[['1','2'],['3','4']]

</blockquote>

also data like

<blockquote>

{'1':'3', '2':'4'}

</blockquote>

So that i did following code

uploadFile(uploadedFile){ let workBook = null; const reader = new FileReader(); const file = uploadedFile[0]; reader.onload = (event) => { const data = reader.result; workBook = XLSX.read(data, { type: 'binary' }); const sheet_name_list = workBook.SheetNames; this.xlData = XLSX.utils.sheet_to_json(workBook.Sheets[sheet_name_list[0]]); log("xlData >>> ",JSON.stringify(this.xlData)); this.arraySaparater = (XLSX.utils.sheet_to_json(workBook.Sheets[sheet_name_list[0]], { header: 1 })); this.arraySaparater = this.arraySaparater.filter((row)=>{ if(Array.isArray(row) && row.length){ return row; } else{ return false; } }); log('ArraySaparater >>>',JSON.stringify(this.arraySaparater)); } reader.readAsBinaryString(file); }

来源:https://stackoverflow.com/questions/57818105/reading-local-excel-file-with-js-xlsx-using-angular-9

Recommend

  • How can I run my ionic app on a physical device (Wiko phone) on Windows?
  • gitlab throwing - failed to store ssl session
  • libgit2 with libssh2 and libopenssl on windows
  • How to split string from meshed content and add html element
  • Build Linux Kernel module with warning i2c_register_board_info undefined
  • Resources for learning Qlik Sense
  • How to delete yarn logs
  • How to get strings in parentheses into array with java
  • Randomly iterate through sequence of integers, 1 to n [duplicate]
  • Starting a javascript prompt after a button is clicked
  • Disappearing icons in WPF
  • Rails Active storage Unable to autoload constant ActiveStorage::Blob::Analyzable
  • Python: Graph using NetworkX and mplleaflet
  • Html Multiple Input Elements With Same Name
  • How to use grep to output unique lines of code from a file?
  • C++ Time measurement of functions
  • what is “Other” category in CosmosDB monitoring graph?
  • Adding custom message on Thank You page by shipping method
  • What is the diff. between default.properties and project.properties?
  • SQL Worksheet is not displaying in SQL Developer
  • async GET request with body from browser
  • Pandas time series data Index from a string to float [duplicate]
  • Exclude Classes from Being Included in Shaded Jar
  • AWS RDS Parameter Group not changing MySQL encoding
  • Arraylist of strings into one comma separated string
  • Query takes almost two seconds but matches only two rows - why isn't the index helping?
  • How to make Rss News Reader application in android …? [closed]
  • Set WebClient.Builder.exchangeStrategies() without losing Spring Jackson configuration
  • using maven pom while creating jar:test-jar some times it says JAR will be empty - no content was ma
  • Google Spreadsheet Script to Blink a range of Cells
  • Android: Unable to detect vertical plane
  • How do I add a mouse over tooltip to an Image using .DrawImage()
  • How to handle div that is created dynamically in a table
  • Bind selectedDates Aggregation for Calendar
  • Unity3d lost directional light shadows after generate assetBundle (.unity3d file)
  • Make checkout phone field optional for specific countries in WooCommerce
  • calling IO Operations from thread in ruby c extension will cause ruby to hang
  • Angular 4: Responsive Grid List
  • Write to .csv file with PHP (Commas in Data Error)
  • How to mutate multiple variables without repeating codes?