Upload Excel File Using Angular 2-3-4-5

Component.Html

Design :

<div class="ui-g-12 ui-md-6 ui-lg-2" [style]="{'display':'block','margin-top':'0px','height':'34px'}">
      <div style="border: 1px solid #ebedf0;padding-top: 10px;margin-top: 10px;padding-bottom:  10px;padding-left: 15px;">       
        <input type="file" style="display: block;" (change)="incomingfile($event)" placeholder="Upload file" accept=".xlsx" style="background-color: #edeff2; width: 95%;">
      </div>
    </div>
     <div class="ui-g-12 ui-md-6 ui-lg-1" [style]="{'display':'block','margin-top':'0px','height':'34px'}">
     
    <button type="button" class="btn btn-info" (click)="Upload()" [disabled]="!this.file" style="margin-top:18px;">Upload</button>

.ts File

import * as XLSX from 'ts-xlsx';

 
incomingfile(event) {

        this.file = event.target.files[0];

    }

   Upload() {

        let fileReader = new FileReader();

        fileReader.onload = (e) => {

            this.arrayBuffer = fileReader.result;

            var data = new Uint8Array(this.arrayBuffer);

            var arr = new Array();

            for (var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);

            var bstr = arr.join("");

            var workbook = XLSX.read(bstr, { type: "binary" });

            var first_sheet_name = workbook.SheetNames[0];

            var worksheet = workbook.Sheets[first_sheet_name];

            this.ExcelData = XLSX.utils.sheet_to_json(worksheet, { raw: true });

            let XmlStr = "<documentelement>";

            this.ExcelData.forEach(element => {

                XmlStr += "<MST_Head><HeadName>" + element['Head Name'] + "</HeadName><PageNo>" + element['Page No'] + "</PageNo><HeadType>SUPPLIER</HeadType><IsActive>true</IsActive><CreateBy>" + JSON.parse(localStorage.getItem("CurrentUserName"))['Employee_ID'] + "</CreateBy></MST_Head>";

            });

            XmlStr += "</documentelement>";

            this._HeadService.HeadInserUpdateWithExcel("HEADINSERTUPDATEWITHEXCEL", XmlStr, this._Pagination).subscribe(

                data => { this._GenericClass = data; this._TotalRecored = data.TotalPage; this.msgs.push({ severity: 'success', summary: 'HEAD ENTRY', detail: data.ReturnMsg }); this.AutoMsgHide(); })

        }

        fileReader.readAsArrayBuffer(this.file);

    }