Angular Exportación de Pivot Grid a Excel y servicio PDF

    Los servicios Ignite UI Excel y PDF Exporter tratan la IgxPivotGrid exactamente como la ven tus usuarios en pantalla: con diseños jerárquicos y resúmenes. Inyecta elIgxExcelExporterService oIgxPdfExporterService, llama al métodoexport correspondienteexport y deja que el servicio genere el documento final.

    Las secciones siguientes explican la configuración, los patrones de uso y consejos para adaptar cada exportación de modo que tus usuarios reciban datos listos para consumir, sin importar el tipo de archivo que prefieran.

    Angular Excel Exporter Example

    Este ejemplo en tiempo real demuestra el flujo de trabajo estándar de exportación de Excel y PDF para la Cuadrícula Pivote: datos enlazados, dos botones de exportación (Excel y PDF) y los archivos resultantes.xlsx​.pdf con estado de filtrado y ordenación preservados. Compártelo con los interesados que quieran adelantar la experiencia antes de integrarla en su aplicación.

    Exporting Pivot Grid's Data

    Meter los exportadores en tu proyecto requiere solo unas pocas líneas de código. Sigue estos pasos y tendrás servicios reutilizables que pueden crear salidas en Excel o PDF bajo demanda:

    1. Importa elIgxExcelExporterService and/oIgxPdfExporterService en tu módulo raíz.
    2. Inyecta el exportador que necesites y llama a suexport método cuando el usuario solicite un archivo.
    // component.ts
import { IgxExcelExporterService, IgxPdfExporterService } from 'igniteui-angular/grids/core';
// import { IgxExcelExporterService, IgxPdfExporterService } from '@infragistics/igniteui-angular/grids/core'; for licensed package

...

private excelExportService = inject(IgxExcelExporterService);
private pdfExportService = inject(IgxPdfExporterService);
    Note

    En la v12.2.1 y posteriores,IgxExcelExporterService se proporciona en la raíz y no necesita registrarse en elproviders array. El exportador de PDF se introdujo en versiones posteriores y está disponible como un servicio inyectable sin ninguna configuración adicional.

    Para iniciar un proceso de exportación, puede utilizar el controlador de un botón en la plantilla de su componente.

    <igx-pivot-grid #pivotGrid [data]="localData" [pivotConfiguration]="pivotConfig"></igx-pivot-grid>
<button (click)="exportButtonHandler()">Export IgxPivotGrid to Excel</button>
<button (click)="exportPdfButtonHandler()">Export IgxPivotGrid to PDF</button>

    Puedes acceder a cualquiera de los servicios exportadores definiéndolo como una dependencia del constructor y dejando que Angular proporcione una instancia. Llamar al método compartidoexport inicia la descarga respetando automáticamente el estado del componente, las filas seleccionadas y las reglas de formato.

    Aquí está el código que ejecutará ambos procesos de exportación en el archivo typescript del componente:

    // component.ts
import { IgxExcelExporterService, IgxExcelExporterOptions, IgxPdfExporterService, IgxPdfExporterOptions } from 'igniteui-angular/grids/core';
import { IgxPivotGridComponent } from 'igniteui-angular/grids/pivot-grid';

@ViewChild('pivotGrid') public pivotGrid: IgxPivotGridComponent;

private excelExportService = inject(IgxExcelExporterService);
private pdfExportService = inject(IgxPdfExporterService);

public exportButtonHandler() {
  this.excelExportService.export(this.pivotGrid, new IgxExcelExporterOptions('ExportedDataFile'));
}

public exportPdfButtonHandler() {
  this.pdfExportService.export(this.pivotGrid, new IgxPdfExporterOptions('ExportedDataFile'));
}

    Una vez conectado, al pulsar los botones correspondientes, se descargan archivos nombradosExportedDataFile.xlsx oExportedDataFile.pdf rellenados con la vista actual de la Cuadrícula Pivote. Puedes cambiar nombres de archivo amigables para el cliente, añadir marcas de tiempo o mostrar un toast de éxito para que los usuarios sepan que su exportación ha finalizado.

    Note

    Los indicadores de expandir/contraer en Excel se muestran según la jerarquía de la última dimensión de la cuadrícula dinámica.

    Note

    La cuadrícula dinámica exportada no tendrá formato de tabla, ya que las tablas de Excel no admiten encabezados de filas múltiples.

    Las exportaciones PDF incluyen automáticamente la fila de cabecera de columna en la parte superior del documento, de modo que los lectores conservan el mismo contexto al abrir o imprimir el archivo.

    Customizing the Exported Content

    La mayoría de los equipos adaptan las exportaciones antes de compartirlas: ocultando columnas de uso interno, renombrando encabezados o saltando filas que solo se aplican a los administradores. Ambos servicios exportadores exponen eventos que te permiten interceptar cada fila o columna y decidir cómo debe aparecer en el archivo. Suscribirse ycolumnExporting​rowExporting hacer ajustes de última hora: configurarcancel = true para omitir un elemento o modificar los argumentos del evento para actualizar los valores sobre la marcha.

    El siguiente ejemplo excluirá todas las columnas de la exportación si su encabezado es "Cantidad de venta":

    // component.ts

this.excelExportService.columnExporting.subscribe((args: IColumnExportingEventArgs) => {
    if (args.header == 'Amount of Sale') {
        args.cancel = true;
    }
});
this.excelExportService.export(this.pivotGrid, new IgxExcelExporterOptions('ExportedDataFile'));

    Cuando exportas datos desde el componente Pivot Grid, los servicios respetan automáticamente la ordenación, filtrado, resúmenes y columnas ocultas para que el archivo refleje lo que el usuario ve actualmente. ¿Necesitas el conjunto de datos completo en su lugar? Activa o incluye filas filtradas, columnas ocultas o metadatos personalizados, las queIgxExcelExporterOptions se activan lasIgxPdfExporterOptions banderas relevantes.

    Known Limitations

    Antes de enviar exportaciones a usuarios de producción, revisa las siguientes restricciones de la plataforma para poder establecer expectativas y ofrecer una orientación útil dentro de tu app.

    Limitación Descripción
    Tamaño máximo de hoja de trabajo El tamaño máximo de hoja de cálculo soportado por Excel es de 1.048.576 filas por 16.384 columnas. Considera segmentar exportaciones extremadamente grandes por rango de fechas o segmento para mantenerte dentro de estos límites.
    Estilo celular El servicio exportador de Excel no soporta exportar un estilo personalizado aplicado directamente a un componente de celda. En estos escenarios, recomendamos usar la biblioteca Excel más rica para un formato de grano fino.
    Formatos PDF amplios Las exportaciones muy amplias pueden forzar que las columnas del PDF se reduzcan para ajustarse a la página. Aplica anchos de columna o oculta campos de baja prioridad antes de exportar para mantener el documento legible.

    API References

    Los servicios de Excel y PDF Exporter tienen algunas APIs más por explorar, que se enumeran a continuación.

    Componentes adicionales que se utilizaron:

    Additional Resources

    Nuestra comunidad está activa y siempre acogida a nuevas ideas. Los enlaces a continuación te conectan con muestras, respuestas de la comunidad y el equipo de ingeniería.