角度導出Excel客戶端

我正在使用Angular v4，我想我該如何構建一個從組件中的對象開始的Excel電子表格。我需要點擊一個按鈕下載Excel文件，我必須做這個客戶端。我有一個由數組組成的json文件，我需要將它轉移到一個excel文件中，這可能是可定製的。可能嗎？如果是，如何？角度導出Excel客戶端

編輯：沒有JS庫請，需要打字稿做到這一點，角

來源

2017-05-22 Gianluca Paris

是可以接受的.csv或它必須是一個xls文件？ – peinearydevelopment

我necessarly需要一個xls文件 –

XLS文件的各個方面，你希望怎麼使用CSV將無法正常工作？ csv將隨Excel程序一起啓動。你需要多張牀單，功能等嗎？ – peinearydevelopment

yourdata = jsonData

ConvertToCSV(objArray) { 
      var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray; 
       var str = ''; 
      var row = ""; 

      for (var index in objArray[0]) { 
       //Now convert each value to string and comma-separated 
       row += index + ','; 
      } 
      row = row.slice(0, -1); 
      //append Label row with line break 
      str += row + '\r\n'; 

      for (var i = 0; i < array.length; i++) { 
       var line = ''; 
       for (var index in array[i]) { 
        if (line != '') line += ',' 

        line += array[i][index]; 
       } 
       str += line + '\r\n'; 
      } 
      return str; 
     }

在HTML

：

<button (click)="download()">export to excel</button>

在組件：

download(){  
var csvData = this.ConvertToCSV(yourdata); 
         var a = document.createElement("a"); 
         a.setAttribute('style', 'display:none;'); 
         document.body.appendChild(a); 
         var blob = new Blob([csvData], { type: 'text/csv' }); 
         var url= window.URL.createObjectURL(blob); 
         a.href = url; 
         a.download = 'User_Results.csv';/* your file name*/ 
         a.click(); 
         return 'success'; 
}

希望你能幫助您

來源

2017-05-29 05:38:00 harish

豈不是可能的。

XLS是一種二進制格式。

項目Apache POI（https://en.wikipedia.org/wiki/Apache_POI）名稱類別爲HSSF（Horrible SpreadSheet Format）。

我的建議，使它在服務器端。

來源

2017-05-24 22:45:06

根據您的要求，您可能不喜歡該答案;然而，如果沒有JS庫，你正在重新發明車輪。我個人發現Excel XML格式令人難以置信，下面的庫（可從Angular內部調用），您可以從已經完成的工作中受益。

您的設計有兩個部分，下載和內容的打開/編輯，與Angular相關的Angular也不是做這項工作的容器。

Search for how to download files within Angular
一旦下載已經發生，並且該文件現在是「本地」打開它使用something like this

來源

2017-05-24 23:07:45

我想你不會得到，如果沒有在後臺JS庫完成。 您需要的是在打字稿中使用Angular項目的類型。

要創建一個excel文件，你可以使用類似exceljs的東西。要在您的項目中使用它，還需要安裝類型here。我不確定這個庫是否適合...以前沒有用過。

對於下載，你應該使用FileSaver.js（我已經使用過它）。

npm install file-saver --save

...和分型：

npm install @types/file-saver --save-dev

對於使用FileSaver.js把下面的導入到你的組件：

import * as FileSaver from 'file-saver';

要觸發下載使用的是：

FileSaver.saveAs(fileData, "filename.xlsx")

'fileData '必須是一個Blob。

希望這會有所幫助。

來源

2017-05-28 12:31:28 Ludwig

角度導出Excel客戶端

回答

相關問題