Angular KendoUI中的异步Excel导出可导出空集合

时间:2019-01-29 11:02:29

标签: angular kendo-ui kendo-ui-angular2

我试图在我们的一个网格中运行异步excel导出,但是我始终得到一个空的xsls 文件,该文件只带有集合标头

数据已正确呈现在网格中,具有过滤和分页功能。

我尝试过这里的文档,但没有成功,这是我的实现方式

我的component.ts中的相关部分:

@Input() collection$: Observable<User[]>;

ngOnInit() {
  this.allData = this.allData.bind(this);
}

allData(): Observable<GridDataResult> {
  return this.collection$.pipe(
    map(users => ({ data: users, total: users.length }))
  );
}

我尝试的第一件事是直接返回this.collection$;,但是行为是相同的:excel文件中的空集合,因此我尝试返回Observable<GridDataResult>而不成功要么。

我的component.html中的相关部分:

<kendo-grid
  [kendoGridBinding]="collection$ | async"
  pageSize="10"
  [pageable]="true"
  [filterable]="true"
>
  <ng-template kendoGridToolbarTemplate>
    <button type="button" kendoGridExcelCommand icon="file-excel">
      Export to Excel
    </button>
  </ng-template>

  <!-- columns -->

  <kendo-pager-prev-buttons></kendo-pager-prev-buttons>
  <kendo-pager-info></kendo-pager-info>
  <kendo-pager-next-buttons></kendo-pager-next-buttons>
  <kendo-pager-page-sizes [pageSizes]="[5, 10, 40]"></kendo-pager-page-sizes>
  <kendo-grid-excel
    fileName="Users.xlsx"
    [fetchData]="allData"
  ></kendo-grid-excel>
</kendo-grid>

有人能对此有所启发吗?预先感谢。

2 个答案:

答案 0 :(得分:1)

显然是因为sudo chmod -R 777 storage 版本:

https://github.com/telerik/kendo-angular/issues/1962

rxjsrxjs拖放到rxjs-compat可以解决此问题。

更新

碰到6.2.2也会解决此问题。

答案 1 :(得分:0)

如果您添加软件包@progress/kendo-angular-excel-export并将allData()函数修改为:

public allData(): ExcelExportData {
   const result: ExcelExportData = {
       data: this.collection$.pipe(
      map(users => ({ data: users, total: users.length })).data
   };
   return result;
}

应该可以