I'm trying export a json data to Excel using xlsx package in Angular 12. (I construct this data from a service, I don't extract from a table)
This is my mock data:
[
{
"Role": "Role 1",
"Modules": [
{
"Name": "Module 1",
"Permissions": {
"Permission 1": [
"Option 1",
"Option 2",
"Option 3"
],
"Permission 2": [
"Option 1",
"Option 2",
"Option 3"
],
"Permission 3": [
"Option 1",
"Option 2",
"Option 3"
]
}
},
{
"Name": "Module 2",
"Permissions": {
"Permission 1": [
"Option 1",
"Option 2",
"Option 3"
],
"Permission 2": [
"Option 1",
"Option 2",
"Option 3"
],
"Permission 3": [
"Option 1",
"Option 2",
"Option 3"
]
}
}
]
},
{
"Role": "Role 2",
"Modules": [
{
"Name": "Module 1",
"Permissions": {
"Permission 1": [
"Option 1",
"Option 2",
"Option 3"
],
"Permission 2": [
"Option 1",
"Option 2",
"Option 3"
],
"Permission 3": [
"Option 1",
"Option 2",
"Option 3"
]
}
}
]
}
]
This is my .ts:
EXCEL_TYPE = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8";
EXCEL_EXTENSION = ".xlsx";
constructor() {}
exportAsExcelFile(jsonData: any[], excelFileName: string) {
console.log('Data dentro del service:', jsonData);
const worksheet: XLSX.WorkSheet = XLSX.utils.json_to_sheet(jsonData);
const workBook: XLSX.WorkBook = {
Sheets: {
'data': worksheet
},
SheetNames: ['data']
};
const excelBuffer: any = XLSX.write(workBook, { bookType: 'xlsx', type: 'array' });
this.saveAsExcelFile(excelBuffer, excelFileName);
}
private saveAsExcelFile(arrayBuffer: any, fileName: string) {
const data: Blob = new Blob([arrayBuffer], { type: this.EXCEL_TYPE });
FileSaver.saveAs(data, fileName + this.EXCEL_EXTENSION);
}
And this is my result: Export's result
Expected result: Expected result
I saw some examples but I don't found something exactly like my case or my data xd, I hope someone can help me :).