Асинхронный экспорт в Excel в Angular KendoUI экспортирует пустую коллекцию - PullRequest
0 голосов
/ 29 января 2019

Я пытаюсь заставить работать асинхронный экспорт в 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 голосов
/ 04 февраля 2019

Очевидно, это из-за версии rxjs:

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

Удаление rxjs и rxjs-compat до 6.2.2 исправило проблему.

ОБНОВЛЕНИЕ

Повышение до 6.4.0 также устраняет проблему.

0 голосов
/ 01 февраля 2019

Если вы добавите пакет @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;
}

Это должно работать

...