Angular Exportação de grade hierárquica para o serviço do Excel

    O serviço Exportador do Excel pode exportar dados para o Excel do IgxHierarchicalGrid. A funcionalidade de exportação de dados é encapsulada IgxExcelExporterService na classe. Para disparar o processo, você precisa invocar o IgxExcelExporterService método do export e passar o componente IgxHierarchicalGrid como o primeiro argumento.

    Angular Excel Exporter Example

    Exporting Hierarchical Grid's Data

    Para começar a usar o IgniteUI Excel Exporter, primeiro importe o IgxExcelExporterService arquivo app.module.ts e adicione o serviço à providers matriz:

    // app.module.ts
    import { IgxExcelExporterService } from 'igniteui-angular';
    // import { IgxExcelExporterService } from '@infragistics/igniteui-angular'; for licensed package
    
    @NgModule({
      providers: [ IgxExcelExporterService ]
    })
    
    export class AppModule {}
    
    Note

    Na v12.2.1 e posterior, os serviços de exportador são fornecidos na raiz, o que significa que você não precisa mais declará-los nos provedores AppModule.

    Para iniciar um processo de exportação, você pode usar o manipulador de um botão no modelo do seu componente.

    <igx-hierarchical-grid #hierarchicalGrid [data]="localData" [autoGenerate]="true"></igx-hierarchical-grid>
    <button (click)="exportButtonHandler()">Export IgxHierarchicalGrid to Excel</button>
    

    Você pode acessar o serviço exportador definindo um argumento do tipo IgxExcelExporterService no construtor do componente e a estrutura Angular fornecerá uma instância do serviço. Para exportar alguns dados no formato do MS Excel, você precisa invocar o método do export serviço exportador e passar o componente IgxHierarchicalGrid como primeiro argumento.

    Aqui está o código que executará o processo de exportação no arquivo datilografado do componente:

    // component.ts
    import { IgxExcelExporterService, IgxExcelExporterOptions } from 'igniteui-angular';
    import { IgxHierarchicalGridComponent } from 'igniteui-angular';
    
    @ViewChild('hierarchicalGrid') public hierarchicalGrid: IgxHierarchicalGridComponent;
    
    constructor(private excelExportService: IgxExcelExporterService) {
    }
    
    public exportButtonHandler() {
      this.excelExportService.export(this.hierarchicalGrid, new IgxExcelExporterOptions('ExportedDataFile'));
    }
    

    Se tudo correu bem, você deverá ver o componente IgxHierarchicalGrid e um botão abaixo dele. Ao pressionar o botão, ele acionará o processo de exportação e o navegador fará o download de um arquivo chamado "ExportedDataFile.xlsx" que contém os dados do componente Hierarchical Grid no formato MS Excel.

    Export All Data

    Há alguns casos em que você pode estar usando operações remotas como paginação e a grade não terá acesso a todos os seus dados. Nesses casos, recomendamos usar o Serviço de Exportação do Excel e passar toda a coleta de dados, se disponível. Exemplo:

    public exportButtonHandler() {
      this.excelExportService.exportData(this.localData, new IgxExcelExporterOptions('ExportedDataFile'));
    }
    

    Export Multi Column Headers Grid

    Agora é possível exportar a Grade Hierárquica com cabeçalhos de várias colunas definidos. Todos os cabeçalhos serão refletidos no arquivo Excel exportado à medida que são exibidos na Grade Hierárquica. Se você quiser excluir os cabeçalhos de várias colunas definidos dos dados exportados, poderá definir o Opção de exportador ignoreMultiColumnHeaders para true.

    Note

    A Grade Hierárquica exportada não será formatada como uma tabela, pois as tabelas do Excel não oferecem suporte a vários cabeçalhos de linha.

    Note

    O estado de expansão exportado dos cabeçalhos de várias colunas nas ilhas de linha sempre estará em seu estado inicial.

    Export Grid with Frozen Column Headers

    Por padrão, o serviço Exportador do Excel exporta a grade com cabeçalhos de coluna roláveis (descongelados). Há cenários em que você pode querer congelar todos os cabeçalhos na parte superior do arquivo Excel exportado para que eles sempre permaneçam à vista enquanto o usuário percorre os registros. Para conseguir isso, você pode definir o Opção de exportador freezeHeaders para true.

    public exportButtonHandler() {
        const exporterOptions = new IgxExcelExporterOptions('ExportedDataFile');
        exporterOptions.freezeHeaders = true;
        this.excelExportService.export(this.grid, exporterOptions);
    }
    

    Customizing the Exported Content

    Nos exemplos acima, o serviço Exportador do Excel estava exportando todos os dados disponíveis. Há situações em que você pode querer pular a exportação de uma linha ou até mesmo de uma coluna inteira. Para conseguir isso, você pode conectar os columnExporting eventos e/ou rowExporting que são disparados respectivamente para cada coluna e/ou cada linha e cancelar o respectivo evento definindo a propriedade do objeto de cancel argumento de evento como true.

    O exemplo a seguir excluirá uma coluna da exportação se seu cabeçalho for "Idade" e se seu índice for 1:

    // component.ts
    
    this.excelExportService.columnExporting.subscribe((args: IColumnExportingEventArgs) => {
      if (args.header == 'Age' && args.columnIndex == 1) {
          args.cancel = true;
      }
    });
    this.excelExportService.export(this.hierarchicalGrid, new IgxExcelExporterOptions('ExportedDataFile'));
    

    Quando você está exportando dados do componente Grade hierárquica, o processo de exportação leva em conta recursos como filtragem de linha e ocultação de coluna e exporta apenas os dados visíveis na Grade hierárquica. Você pode configurar o serviço de exportador para incluir linhas filtradas ou colunas ocultas definindo propriedades no IgxExcelExporterOptions objeto.

    Known Limitations

    Limitação Descrição
    Níveis hierárquicos O serviço de exportador do Excel pode criar até 8 níveis de hierarquia.
    Tamanho máximo da planilha O tamanho máximo da planilha com suporte no Excel é de 1.048.576 linhas por 16.384 colunas.
    Exportando colunas fixadas No arquivo do Excel exportado, as colunas fixadas não serão congeladas, mas serão exibidas na mesma ordem em que aparecem na grade.
    Estilo de célula O serviço exportador do Excel não oferece suporte à exportação de um estilo personalizado aplicado a um componente de célula. Nesses cenários, recomendamos o uso da Biblioteca do Excel.

    API References

    O serviço Exportador do Excel tem mais algumas APIs para explorar, listadas abaixo.

    Componentes adicionais que foram usados:

    Additional Resources

    Nossa comunidade é ativa e sempre acolhedora para novas ideias.