Forums Ignite UI for Angular
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Bavisha Sree Rama Dhoss
15
Export to Excel in igx hierarchical grid not exporting data
posted

               We are using ignite ui version 11.1.32 and using hierarchical grid to show the data, We need to Export the data to excel on click of export button. On Export only the Excel file is getting downloaded without any data. Please find below the code used. Could you please help to sought this out.

HTML:

<button (click)="onExport()"></button>
<igx-hierarchical-grid id="individualELTGrid" #individualELTGrid [data]="individualELTData" [displayDensity]="'compact'"
    [autoGenerate]="false" [emptyGridMessage]="'No ELT Available'" [primaryKey]="'analysisID'" width="100%"
    height="100%" hiddenColumnsText="Customize Columns" [allowFiltering]="true" [filterMode]="'excelStyleFilter'"
    [rowSelection]="'multiple'" [cellSelection]="'none'" (onRowSelectionChange)="onRowSelection($event)">

    <igx-column field="analysisID" [filterable]="true"></igx-column>
    <igx-column field="analysisName" [filterable]="true"></igx-column>
    <igx-column field="analysisDescription" [filterable]="true"></igx-column>
    <igx-column field="engineType" [filterable]="true"></igx-column>
    <igx-column field="engineVersion" [filterable]="true"></igx-column>
    <igx-column field="isGroup" [filterable]="true"></igx-column>

    <igx-row-island [key]="'children'" [autoGenerate]="false">
        <igx-column field="groupAnalysisID" [filterable]="true"></igx-column>
        <igx-column field="childAnalysisID" [filterable]="true"></igx-column>
        <igx-column field="analysisName" [filterable]="true"></igx-column>
        <igx-column field="analysisDescription" [filterable]="true"></igx-column>
        <igx-column field="engineType" [filterable]="true"></igx-column>
        <igx-column field="engineVersion" [filterable]="true"></igx-column>
        <igx-column field="isGroup" [filterable]="true"></igx-column>
    </igx-row-island>
</igx-hierarchical-grid>
TS:
import { Component, ViewChild } from '@angular/core';
import { IgxColumnComponent, IgxExcelExporterOptions, IgxExcelExporterService, IgxHierarchicalGridComponent } from 'igniteui-angular';
import { ConvertToIndividualELT, ELTDATA, Singer, SINGERS } from '../../data/artistData';

@Component({
    selector: 'app-hierarchical-grid-excel-export-sample',
    styleUrls: ['hierarchical-grid-excel-export.sample.scss'],
    templateUrl: 'hierarchical-grid-excel-export.sample.html'
})
export class HGridExcelExportSampleComponent {
    individualELTData: ConvertToIndividualELT[] = [];
    @ViewChild('individualELTGrid') public individualELTGrid: IgxHierarchicalGridComponent;
  
    constructor(
      private excelExportService: IgxExcelExporterService) {   
      this.individualELTData = ELTDATA;
    }
  
    onExport () {
      if (this.individualELTGrid.dataLength > 0) {
        this.excelExportService.export(this.individualELTGrid, new IgxExcelExporterOptions('ELTDetails'));
      }
    }
}
Data:
export interface ConvertToIndividualELT {
    analysisID: number;
    groupAnalysisID: number;
    childAnalysisID: number;
    analysisName: string;
    analysisDescription: string;
    engineTypeId: number;
    engineType: string;
    engineVersion: string;
    isGroup: boolean;
    path: string;
    children: ConvertToIndividualELT[];
  }
  
  export const ELTDATA: ConvertToIndividualELT[] = [ {
    "children": [
      {
        "children": [],
        "analysisID": null,
        "groupAnalysisID": 200,
        "childAnalysisID": 2,
        "analysisName": "ABC RE-CA",
        "analysisDescription": "",
        "engineTypeId": 101,
        "engineType": "ALM",
        "engineVersion": "18.0.1930.0",
        "isGroup": false,
        "path": "200"
      },
      {
        "children": [],
        "analysisID": null,
        "groupAnalysisID": 200,
        "childAnalysisID": 3,
        "analysisName": "XYZ Corp. LA",
        "analysisDescription": "Test Spider",
        "engineTypeId": 100,
        "engineType": "DLM",
        "engineVersion": "18.0.1930.0",
        "isGroup": false,
        "path": "200"
      }    
    ],
    "analysisID": 200,
    "groupAnalysisID": null,
    "childAnalysisID": null,
    "analysisName": "EDM Run Grp",
    "analysisDescription": "",
    "engineTypeId": 102,
    "engineType": "Group",
    "engineVersion": "18.1.1945.0",
    "isGroup": true,
    "path": null
  }]
Parents Reply Children
No Data