为 Angular 中的多个动态 kendo 网格导出 excel 2

Question

我正在开发一个包含多个 Kendo 基于用户输入的网格组件的网页。我的要求是将所有这些网格导出到 excel 报告。我为每个网格实施了 Kendo-grid excel 导出，它按预期工作，但是要为所有这些动态网格提供一个通用的导出按钮，我该如何继续。我正在使用 angular 2 来实现此功能。我可以为所有这些网格使用一个共同的参考变量吗？请提出建议。

Answer 1

请参考本题答案。它将帮助您合并来自多个来源的所有工作表 - Kendo UI for Angular 2: Excel export having multiple worksheets

如果你喜欢自己操作工作表，请看这个plunker 我写的。它显示了如何添加行（作为 header 或数据）- 在撰写本文时，这还没有记录。

相关代码：

import { Component } from '@angular/core';
import { products } from './products';

@Component({
    selector: 'my-app',
    template: `
        <button type="button" class="k-button" (click)="save(excelexport)">Export To Excel</button>

        <kendo-excelexport #excelexport [data]="data" [fileName]=downloadFileName>
            <kendo-excelexport-column field="ProductID" title="Product ID" [width]="75">
            </kendo-excelexport-column>
            <kendo-excelexport-column field="ProductName" title="Product Name">
            </kendo-excelexport-column>
            <kendo-excelexport-column field="SomeDate" title="Start Date" [cellOptions]="{ format: 'mm/dd/yyyy' }"></kendo-excelexport-column>
      </kendo-excelexport>
    `
})
export class AppComponent {
    public data: any[] = products;
    public downloadFileName: string = "Report - Rates.xlsx"

    public save(component): void {
        const options = component.workbookOptions();

        options.sheets[0].name = `Rate Card Report`;

        let rows = options.sheets[0].rows;
        let infoRows = [
          { cells: [{value: "12345"}], type: 'data', xyz: 1 },
          { cells: [{value: "My stuff LLC"}], type: 'data', xyz: 1 },
          { cells: [{value: "2 Fun Street"}], type: 'data', xyz: 1 },
          { cells: [{value: "Rye, NY - 10580"}], type: 'data', xyz: 1 },
          ];

        Array.prototype.unshift.apply(rows, infoRows);
        console.log(rows);

        component.save(options);
    }
}

为 Angular 中的多个动态 kendo 网格导出 excel 2

Exporting excel for multiple dynamic kendo grids in Angular 2

kendo-ui

kendo-grid

kendo-ui-angular2