Home  >  Forum  >  Angular
Post New Query

Angular2 table export to Excel



Asked on May 08, 2018
when i export datatable to Excel From angular2, in Excel sheet it showing me all data in Vertical format instead of showing in proper table format. 

Like Im getting data in column manner.

Number 
Name 
Email 
Employee Type 
Action 
11111
xxx xxxx
[email protected]
contract
mode_edit delete 
11112
xxx xxxx
[email protected]
contract
mode_edit delete 


 But i need data in row manner Like this.

Number     Name          Email                Employee Type      Action
11111       xxx xxxx      [email protected]    contract               mode_edit delete
11112       xxx xxxx      [email protected]    contract               mode_edit delete


Below is my Angular2 code:

 --component.html--
 
<input type="button" (click)="tableToExcel('testTable', 'EmployeeList')" value="Export to Excel">
<table id="testTable">

 --component.ts--
 
  tableToExcel(table, EmployeeList){
let uri = 'data:application/vnd.ms-excel;base64,'
, template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--><meta http-equiv="content-type" content="text/plain; charset=UTF-8"/></head><body><table>{table}</table></body></html>'
, base64 = function(s) { return window.btoa(decodeURIComponent(encodeURIComponent(s))) }
, format = function(s,c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) }
if (!table.nodeType) table = document.getElementById(table)
var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML}
window.location.href = uri + base64(format(template, ctx))
}
}


Write Answer







©2019 concretepage.com | Privacy Policy | Contact Us