PrimeNG DataTableをエクセル、pdf、xmlにエクスポート

Question

PrimeNG DataTableには、データをCSVファイルにエクスポートする機能があります。 Excel、PDF、XMLにデータをエクスポートする機能を提供する必要があります。 Angular2アプリケーションでこれをどのように達成できますか？

Answer 1

PrimeNgは、ネイティブでCSVにデータ可能なもの以上のものをサポートしていません。したがって、この機能を「最初から」構築する必要があります。

良いアプローチは次のようになります：

1. あなたはすでにあなたの成分を返す内のオブジェクトにデータを持っています。これは、このようなあなたのDataTableに渡すオブジェクトのようになります。

   <p-dataTable [value]="cars">

   ので、我々のデータは、車のオブジェクトです。あなたの成分を返すには、あなたのデザイン」の行で何かを読んでいましたボタンに合った他の部分あなたのDataTableヘッダにまたはのいずれかを追加することです

   this.cars

2. 次のステップを使用してアクセスすることができますpdfをダウンロードしてください。

   <p-button label="Click to download PDF" styleClass="ui-button-info" (click)="download()"></p-button>

   あなたはPDFまたは他のどんなフォーマットあなたが必要にデータを変換する必要がダウンロード方式で最後に

3. をクリックしたときに、これはあなたのコンポーネントのメソッドのダウンロードを呼び出します。このような何か。これは、多くのオンラインライブラリの1つ、たとえばPDF：jsPDFを使用して簡単に行うことができます。角度のある実例はplunker example jsPDF angular4です。

   let doc = new jsPDF(); 
   let col = ["Details", "Values"]; 
   let rows = []; 
   for(let key in this.cars){ 
       let temp = [key, item[key]]; 
       rows.push(temp); 
   } 
   doc.autoTable(col, rows); 
   doc.save('Test.pdf');