用于Angular 2 Excel导出日期格式的Kendo Grid

时间:2017-11-13 20:26:18

标签: excel angular grid export kendo-ui-angular2

当我们尝试从Angndo的Kendo UI Grid导出网格数据时,其中一个网格列(日期列)不会格式化实际日期值。 这是我的代码。

<kendo-excelexport [data]="products" [group]="group" fileName="products.xlsx" [headerPaddingCellOptions]="headerPaddingCells" #excelexport>
    <kendo-excelexport-column field="dateofService" title="Date(s) of Service" [width]="170"  [cellOptions]="{ format: 'yy-MM-dd hh:mm:ss' }"  >
    </kendo-excelexport-column>
    <kendo-excelexport-column field="memberName"   title="Patient"  [width]="250">
        <ng-template kendoGridExcelTemplate >Bob Woolmer</ng-template>
    </kendo-excelexport-column>
    <kendo-excelexport-column field="provider" title="Provider" [width]="180">
    </kendo-excelexport-column>
    <kendo-excelexport-column field="status" title="Status" [width]="100">
    </kendo-excelexport-column>
    <kendo-excelexport-column field="patientResponsibility" title="You Owe" width="120"   [cellOptions]="{ format: '$#,##0.00',bold:true }">
    </kendo-excelexport-column>
</kendo-excelexport>

服务日期列始终显示&#34; 2017-09-09T00:00:00&#34;而不是09/09/2017。

是否有人知道如何格式化日期,以便在角度剑道网格中的excel导出中只有MM / dd / yyyy?

1 个答案:

答案 0 :(得分:0)

而不是这个

<kendo-excelexport-column field="dateofService" title="Date(s) of Service" [width]="170"  [cellOptions]="{ format: 'yy-MM-dd hh:mm:ss' }"></kendo-excelexport-column>`

试试这个

<kendo-excelexport-column field="dateofService" title="Date(s) of Service" [width]="170"  [cellOptions]="{ format: 'mm/dd/yyyy' }"></kendo-excelexport-column>

如果查看excel导出API - CellOptions,它们似乎支持所有Excel格式选项。

以下链接指定了所有支持的单元格格式选项:Supported Formats

完整示例代码(另请参阅此处的操作:Plunker

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 = "My file.xlsx"

    public save(component): void {

        this.data.forEach((product) => {
          product.SomeDate = new Date();
        });

        setTimeout(
          () => {
            const options = component.workbookOptions();
            component.save(options);
          }, 1000);
    }
}