@nikhil200816/ngx-json-to-csvgenerator

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