PrimeNG CSVへのエクスポート

Question

私はPrimeNG gridを持っていて、PrimeNGによって提供されるデータは、サーバー側のページ付けされたデータを持つサービスからのものであり、サーバーからは現在のページレコードのみを受け取ります。

私は以下のように私のHTMLコードしている：

<p-dataTable *ngIf="displayTable" #dataTable [value]="JSONArray" 
      [lazy]="true" [responsive]="true" [rows]="10" 
      [paginator]="true" selectionMode="single" 
      [(selection)]="selectedEvent" 
      (onRowSelect)="onRowSelect($event)" 
      [pageLinks]="5" [(first)] = "first" 
      class="ui-datatable-scrollable-wrapper view-table" 
      [totalRecords]="totalRecords" (onLazyLoad)="loadCarsLazy($event)"> 
      <p-header> 
       <div class="ui-helper-clearfix"> 
        <button type="button" pButton icon="fa-file-o" iconPos="left" 
        label="CSV" (click)="dataTable.exportCSV()" style="float:left"> 
        </button> 
       </div> 
      </p-header> 
      <p-column field="col1" header="Column 1"></p-column> 
      <p-column field="col2" header="Column 2"></p-column> 
      <p-footer> 
       <div> 
       </div> 
      </p-footer> 
</p-dataTable> 

JSONArray変数は10のレコード（私のページサイズ）を持つことになりますが、我々は、サーバーからすべてのデータをエクスポートします。私は5ページを持っているとしましょう、私は50レコードすべてをエクスポートしたいと思います。

dataTable.exportCSV()は、現在のページ10レコードのみをエクスポートしています。 50レコードすべてをエクスポートする方法はありますか？

Answer 1

だけ変更：

[rows]="10" 

をしたい任意の値に。

同様：

[rows]="50"

また、これを動的に変更することができます。

Answer 2

誰かを助けることを望む解決策を共有する直接的な解決策はありません。

私のHTMLはこのように見えます。

<p-dataTable *ngIf="displayTable" #dataTable [value]="JSONArray" 
      [lazy]="true" [responsive]="true" [rows]="rowCount" 
      [paginator]="true" selectionMode="single" 
      [(selection)]="selectedEvent" 
      (onRowSelect)="onRowSelect($event)" 
      [pageLinks]="5" [(first)] = "first" 
      class="ui-datatable-scrollable-wrapper view-table" 
      [totalRecords]="totalRecords" (onLazyLoad)="loadCarsLazy($event)"> 
      <p-header> 
       <div class="ui-helper-clearfix"> 
        <button type="button" pButton icon="fa-file-o" iconPos="left" 
        label="CSV" (click)="exportCSV(dataTable)" style="float:left"> 
        </button> 
       </div> 
      </p-header> 
      <p-column field="col1" header="Column 1"></p-column> 
      <p-column field="col2" header="Column 2"></p-column> 
      <p-footer> 
       <div> 
       </div> 
      </p-footer> 
</p-dataTable> 

my typescriptは次のようになります。

private _dataTable: any; 
private rowCount: Number; 
private pageNoSize: any; 

exportCSV(dataTable) { 
     this.rowCount = 50; 
     this.pageNoSize = 'page=0&size=' + this.rowCount; 
     this._dataTable = dataTable; 
     this.getJSONData(); 
    } 


getJSONData() { 
    this.getJSONDataService.get(uri + this.pageNoSize) 
     .subscribe(
     data => { 

       this._dataTable.value = data; 
       this._dataTable.exportCSV(); 
       this.rowCount = 10; 

     }, 
     error => { 
     }, 
    ); 
}