🔔 Subscribe for more angular videos with live examples
/channel/UC-FyE8pmbzUw7sb293FOdlA
Uploading files is a common requirement in Angular apps and in this video, we see how easy it is.
You can find the source code in the below git-hub repository:
https://github.com/sadupawan1990/excelreader
Code:
Excelsheet.component.ts
import { Component, OnInit } from '@angular/core';
import * as XLSX from 'xlsx';
@Component({
selector: 'app-excelsheet',
templateUrl: './excelsheet.component.html',
styleUrls: ['./excelsheet.component.css']
})
export class ExcelsheetComponent implements OnInit {
data: [][];
constructor() { }
ngOnInit(): void {
}
onFileChange(evt: any) {
const target : DataTransfer = DataTransfer (evt.target);
if (target.files.length !== 1) throw new Error('Cannot use multiple files');
const reader: FileReader = new FileReader();
reader.onload = (e: any) = {
const bstr: string = e.target.result;
const wb: XLSX.WorkBook = XLSX.read(bstr, { type: 'binary' });
const wsname : string = wb.SheetNames[0];
const ws: XLSX.WorkSheet = wb.Sheets[wsname];
console.log(ws);
this.data = (XLSX.utils.sheet_to_json(ws, { header: 1 }));
console.log(this.data);
};
reader.readAsBinaryString(target.files[0]);
}
}
Search Tags
excel reader app angular | angular read excel file | read excel file in javascript | exceljs angular 6 | exceljs angular |excel angular | spreadsheet javascript | spreadsheet angular | angular excel export | how to read excel file in angularjs | how to read excel file in angular | read excel file in angular | read excel file in angular 6 | upload excel file in angular 6 | upload excel file in angular 9 | upload excel file in angular | upload excel file in angular 4 | upload excel file in angular 7 | upload excel file in angular 6 and spring boot | how to upload file in angular | how to upload file in angular 8 | how to upload file in angular 6 | how to upload file in angularjs | how to upload file in angular with web api | file upload control in angular 8 | file upload control in angular material | File Upload in Angular 7 | File Upload in Angular 8 | angular multiple file upload | angular file upload progress bar | angular | angular tutorial | angular ngOnchanges example | angular tutorial for beginners |