Kendo ui 在Angular 2中导出多个动态剑道网格的excel

Kendo ui 在Angular 2中导出多个动态剑道网格的excel,kendo-ui,kendo-grid,kendo-ui-angular2,Kendo Ui,Kendo Grid,Kendo Ui Angular2,我正在开发一个网页,其中包含基于用户输入的多个剑道网格组件。我的要求是将所有这些网格导出到excel报表。我为每个网格实现了Kendo grid excel导出,它按预期工作,但要为所有这些动态网格提供一个通用的导出按钮,我如何继续。我使用angular 2实现此功能。我可以为所有这些网格使用公共参考变量吗?请提出建议。请参考此问题的答案。它将帮助您合并来自多个来源的所有工作表- 如果您想自己操作工作表,请参见此 我写的。它展示了如何添加行(作为标题或数据)——在撰写本文时,还没有对此进行记录

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

请参考此问题的答案。它将帮助您合并来自多个来源的所有工作表-

如果您想自己操作工作表,请参见此 我写的。它展示了如何添加行(作为标题或数据)——在撰写本文时,还没有对此进行记录

相关代码:

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/core'导入{Component};
从“/products”导入{products};
@组成部分({
选择器:“我的应用程序”,
模板:`
导出到Excel
`
})
导出类AppComponent{
公共数据:任何[]=产品;
公共下载文件名:string=“Report-Rates.xlsx”
公共保存(组件):无效{
const options=component.workbookOptions();
options.sheets[0]。name=`Rate Card Report`;
设行=选项。工作表[0]。行;
设infoRows=[
{单元格:[{value:“12345”}],键入:'data',xyz:1},
{cells:[{value:“我的东西有限责任公司”}],键入:'data',xyz:1},
{cells:[{value:“2 Fun Street”}],键入:'data',xyz:1},
{cells:[{value:“Rye,NY-10580”}],键入:'data',xyz:1},
];
Array.prototype.unshift.apply(行,infoRows);
console.log(行);
保存(选项);
}
}

您希望它如何在客户端发挥作用还不清楚。非常感谢这项工作满足了我的要求。你帮我节省了很多时间,再次感谢你。