@nikhil200816/ngx-json-to-csvgenerator
v1.0.2
Published
A Simple directive to Export CSV from Json.
Downloads
14
Maintainers
Readme
NgxJsonToCSVGenerator
This project was generated with Angular CLI version 6.0.8.
ngx-json-to-csvgenerator | Export to CSV
A directive to export CSV file from json in Angular 6 and above
Installation
npm install --save @nikhil200816/ngx-json-to-csvgenerator
Example
Add module in app.module.ts
import { NgxJsonToCSVGeneratorModule } from '@nikhil200816/ngx-json-to-csvgenerator';
Add in imports section
imports: [
BrowserModule,
NgxJsonToCSVGeneratorModule
],
Use in component
const dataList = [
{
id: 1,
name: 'github',
price: '200$',
publisher: {
name: 'hieutran',
company: 'Dtag-VN'
},
nested:[
{
name: 'name1',
company: 'company1'
},
{
name: 'name2',
company: 'company2'
}]
},
{
id: 2,
name: 'twitter',
price: '500$',
publisher: {
name: 'twitter tran',
company: 'Canada'
},
nested:[]
},
{
id: 3,
name: 'google',
price: '300$',
publisher: {
name: 'tran',
company: 'Vietname'
},
nested:[
{
name: 'name3',
company: 'company3'
},
{
name: 'name4',
company: 'company4'
}]
}
];
<button ngx-json-to-csvgenerator
[data]="dataList"
[reportFields]="{id: 'ID Heder', name: 'Name Header', price: 'Price Head',
'publisher.name': 'Publisher Head', 'publisher.company': 'Company Head'}"
nestedDataProperty="nested"
[nestedReportFields]="{name: 'Nested Name', company: 'Nested Company'}"
filename="Export_Report">
Export Button
</button>
<div ngx-json-to-csvgenerator
[data]="dataList"
[reportFields]="{id: 'ID Header', name: 'Name Header'}"
nestedDataProperty="nested"
[nestedReportFields]="{name: 'Nested Name', company: 'Nested Company'}"
filename="Export_Report">
Export Button
</div>
Options
| Option | Description | | :-------------| -----| | data | Set the data array | | report-fields | Name of the coloumn and keys to be exported | | nested-data-property | If provided, will use nested value to export | | nested-report-fields | Name of the coloumn and keys to be exported | | filename | Set to change the file name |