可以导出多个kendo网格以实现角度优势

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了可以导出多个kendo网格以实现角度优势相关的知识,希望对你有一定的参考价值。

有一个记录功能,用于将多个kendo网格导出到一个excel文件,用于jQuery网格,但没有任何内容等于网站上的角度。

然而,也许有人设法做角度?

答案

您可以导出多个数据集(Grid可以绑定到每个数据集,但Excel导出不是必需的)。这是一个例子:

<button type="button" class="k-button" (click)="save(excelexport, excelexport1)">Export To Excel</button>

        <kendo-excelexport [data]="data" fileName="Products.xlsx" #excelexport>
            <kendo-excelexport-column field="ProductID" [locked]="true" title="Product ID" [width]="200">
            </kendo-excelexport-column>
            <kendo-excelexport-column field="ProductName" title="Product Name" [width]="350">
            </kendo-excelexport-column>
            <kendo-excelexport-column field="UnitPrice" title="Unit Price" [width]="120">
            </kendo-excelexport-column>
      </kendo-excelexport>
        <kendo-excelexport [data]="data1" fileName="Products.xlsx" #excelexport1>
            <kendo-excelexport-column field="ProductID" [locked]="true" title="Product ID" [width]="200">
            </kendo-excelexport-column>
            <kendo-excelexport-column field="ProductName" title="Product Name" [width]="350">
            </kendo-excelexport-column>
            <kendo-excelexport-column field="UnitPrice" title="Unit Price" [width]="120">
            </kendo-excelexport-column>
      </kendo-excelexport>

public save(component1, component2): void {
      Promise.all([component1.workbookOptions(), component2.workbookOptions()]).then((workbooks) => {
        workbooks[0].sheets = workbooks[0].sheets.concat(workbooks[1].sheets);
        component1.save(workbooks[0]);
      });
    }

http://plnkr.co/edit/nAGrfaM2H4VK6tKIFTyP?p=preview

Excel Export documentation也可以派上用场。

另一答案

所以解决方案是使用kendo API,它允许我们从头开始组装文件,只需将带有数据和参数的WorkbookOptions对象传递给save方法。

简短的例子js-code:

 public save(component): void {
    const options = {
        sheets: [
            {
                name: 'Sheet One',
                filter: {
                    from: 0,
                    to: 1
                },
                columns: [
                    {
                        width: 100
                    },
                    {
                        width: 200
                    },
                ],
                rows: [
                    {
                        cells: [
                            {
                                color: '#ffffff',
                                background: '#808080',
                                value: 'First name'
                            },
                            {
                                color: '#ffffff',
                                background: '#808080',
                                value: 'Last Name'
                            }
                        ]
                    },
                    {
                        cells: [
                            {
                                value: 'Erick'
                            },
                            {
                                value: 'Carthman'
                            }
                        ]
                    },
                    {
                        cells: [
                            {
                                value: 'Stan'
                            },
                            {
                                value: 'Marzh'
                            }
                        ]
                    }
                ]
            },
            {
                name: 'Sheet Two',
                filter: {
                    from: 0,
                    to: 1
                },
                columns: [
                    {
                        width: 100
                    },
                    {
                        width: 200
                    },
                ],
                rows: [
                    {
                        cells: [
                            {
                                color: '#ffffff',
                                background: '#808080',
                                value: 'Name'
                            },
                            {
                                color: '#ffffff',
                                background: '#808080',
                                value: 'Length'
                            }
                        ]
                    },
                    {
                        cells: [
                            {
                                value: 'Vasya'
                            },
                            {
                                value: 10
                            }
                        ]
                    },
                    {
                        cells: [
                            {
                                value: 'Petya'
                            },
                            {
                                value: 19.5
                            }
                        ]
                    }
                ]
            }
        ]
    };
    component.save(options);

标记:

        <button type="button" class="k-button" (click)="save(excelexport)">Export To Excel</button>
    <kendo-excelexport fileName="Products.xlsx" #excelexport></kendo-excelexport>

以上是关于可以导出多个kendo网格以实现角度优势的主要内容,如果未能解决你的问题,请参考以下文章

kendo ui 角度网格选择事件

有没有办法以角度刷新剑道网格?

如何根据剑道网格中的特定列条件更改行的颜色以获取角度

如何在Kendo UI网格中自定义导出excel

Kendo UI:在导出到 excel 和 pdf 期间操作网格列

Kendo网格在网格中触发多个控件的数据源事件。(MVVM绑定)