データベースからデータをフェッチし、Angular2を使用してCSVファイルにエクスポートする方法

Question

データベースからcsvファイルにデータをフェッチする必要があります。私はすべてのデータを取得できましたが、オブジェクト形式のデータを取得できませんでした.CSSファイルに[オブジェクトオブジェクト]として表示されます。

TSファイル：

getData() { 
    let source = this.resultList; 
    let destination = []; 
    for (let i = 0; i < source.length; i++) { 
     let entry = new Entry(); 
     entry.id = source[i]['id']; 
     entry.participantId = source[i]['participantId']; 
     entry.completedOn = moment(source[i]['completedOn']).format('DD/MM/YYYY'); 
      if (typeof source[i]['satisfaction'] == 'string') { 
       entry['satisfaction'] = source[i]['satisfaction'] 
      } else { 
       for (var property in source[i]['satisfaction']) { 
        if (source[i]['satisfaction'].hasOwnProperty(property)) { 
        entry[property] = source[i]['satisfaction'][property] 
        } 
      } 
      } 
     destination.push(entry); 
    } 
    return destination; 
    } 
    } 

私はそれが代わりに項目を表示する[オブジェクトのオブジェクト]と表示される、csvファイルに "prodandService" に存在するオブジェクトをフェッチすることができません。

JSONデータ：

{ "満足"：{ "prodandService"：[{ "インデックス"： "Orbiz"}、{ "インデックス"： "qwerq"}、{ "インデックス"：」 {"index"： "test"}、{"index"： "TestWD"}、{"index"： "IOS app"}、{"index"： " {"インデックス"： "口紅"}、{"インデックス"： "ウェブサイト"}、{"インデックス"： "App IOS"}、{"索引" 「シャンプーバニラ」}、{「インデックス」：「シャンプーストロベリー」}、「インデックス」：「車」、「口紅」、「価格」、「中」、「顧客」、「はい」、 「電話」、「電話ビスト」、「3」、「重要度」：「品質」、「頻度」、「四半期」、「満足度」：「3」、 }、 "completedOn"： "2017-08-28T09：39：54.676Z"、 "id"：10、 "participantId"：217}

助けてください。

Answer 1

あなたは私のために素晴らしい仕事をCSVファイルにエクスポートするライブラリを使用する必要があります。

私は私のAngular4アプリから文書をエクスポートできるようにするには外部ライブラリを使用してきた：https://github.com/eligrey/FileSaver.js/

データを抽出するために使用したサンプルコードを次に示します。

活字体の成分：（編集）

// Notice the parameters from the service call that give me back my filtered datas 
    exportDatas(documentType: string) { 
    // I believe you store your service data you want to export in this.resultList 
    let source = this.resultList; 
    const blob = new Blob([source.blob()]); 
    const objectUrl = URL.createObjectURL(blob); 
    FileSaver.saveAs(blob, 'Export.' + documentType); 
    } 

テンプレート側：（編集）

<div> 
    <button (click)="exportDatas('csv')" type="button">CSV</button> 
    <button (click)="exportDatas('pdf')" type="button">PDF</button> 
</div> 

---

ワークスIは、イベントをトリガするボタンにこの方法をバインドさ素晴らしいですし、コードは簡単です。

EDIT：

使用NPMインストールする：

• npm install file-saver --save
• npm install @types/file-saver --save-dev（タイプあなたがそれらを必要とする場合、私はそれらを使用しませんでしたが）

とインポート（Angular-CLIを使用しています）：

0タイプなし

• ：種類とimport * as FileSaver from 'file-saver';
• は（テストしていないが、私はそれが正しいだと信じて）：import { FileSaver } from 'file-saver';