Export PDF from ngx datatable using angular 2

Question

I am trying to do export pdf displayed by ngxdatable in Angular 2. How to do it?

ngx datatable doesn't support data export, and they have no plans to add support, according to their documentation. — Claies, Aug 30 '17 at 15:24

score 3 · Answer 1 · answered Aug 30 '17 at 15:42

There is a way actually...

The issue is to export only what you filtered, so the thing is to keep track of the filtered datas of your table.

I've been using an external library to be able to export documents from my Angular4 app : https://github.com/eligrey/FileSaver.js/

Here is the sample code I used to extract my data. I binded this method to a button to trigger the event :

TypeScript component :

  // Notice the parameters from the service call that give me back my filtered datas
  exportDatas(documentType: string) {
    this.equipmentService.getExportDatas(this.detail.equipment.id, this.beginDate, this.endDate, this.frameType, documentType, this.timezoneOffset, this.translateService.currentLang)
    .subscribe(result => {
      const blob = new Blob([result.blob()]);
      const objectUrl = URL.createObjectURL(blob);
      FileSaver.saveAs(blob, 'Export.' + documentType);
    });
  }

Template side :

<div fxLayoutAlign="end">
  <span class="label">{{'EQP_HISTORY.EXPORT'|translate}} :</span>
  <button (click)="exportDatas('csv')" type="button">CSV</button>
  <button (click)="exportDatas('pdf')" type="button">PDF</button>
</div>

The most important part of how you get your data (getExportDatas) is missing from the answer... — Royi Mindel, Jun 06 '18 at 08:12

Export PDF from ngx datatable using angular 2

1 Answers1