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 | |
| Employee Type | |
| Action | |
| 11111 | |
| xxx xxxx | |
| xxxx@gmail.c | |
| contract | |
| mode_edit delete | |
| 11112 | |
| xxx xxxx | |
| xxxx@gmail.c | |
| contract | |
| mode_edit delete | |
But i need data in row manner Like this.
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))
}
}
