将JSON导出到xlsx中

时间:2019-10-15 09:44:28

标签: javascript angular

我正在尝试将json导出到xlsx。我能够导出它,但是在excel文件中无法获得正确的格式。

这是我的代码:

downloadFile() {
 let  Obj =  {
    "data": [12,123],
    "date": ["2018-10-10","2018-02-10"]
  }
  const items = [];
  items['data'] = Obj.data;
  items['date'] = Obj.date;
  const header = Object.keys(items);
  let csv;
  header.map((data)=>{
  csv = this.items[data];
  });
  csv.unshift(header.join(','))
  let csvArray = csv.join('\r\n');
  var blob = new Blob([csvArray], { type: 'text/csv' })
  FileSaver.saveAs(blob, "filename" + ".xlsx");
}

O / p我得到了:[“数据,日期”,“ 2018-10-10”,“ 2018-02-10”]

我无法在Excel中呈现日期值

我导出的excel文件的屏幕截图:   enter image description here

2 个答案:

答案 0 :(得分:1)

您需要以下类似的内容。为了将数据放在一列中,将日期放在一列中,您将必须以一种将数据按列排列时想要的方式来构造数据。下面是一个示例,您可以尝试下载,它将按预期运行。 一个更简单的解决方案是创建一个隐藏的html表,该表具有与您要导出的结构相似的数据,然后将其转换为CSV。

function downloadFile() {
  let Obj = {
    "data": [12, 123],
    "date": ["2018-10-10", "2018-02-10"]
  }
  const items = [];
  items[0] = Object.keys(Obj);
  items[1] = [Obj.data[0], Obj.date[0]];
  items[2] = [Obj.data[1], Obj.date[1]];
  let csvContent = '';
  items.forEach((rowArray) => {
    let row = rowArray.join(",");
    csvContent += row + "\r\n";
  });
  console.log(csvContent)
}

downloadFile();

以下是如何将HTML表格下载到CSV的示例。在使用angular时,您可以使用'* ngFor'根据数据创建表格。

function toCsv() {
  const csv = [];
  const rows = document.getElementById('table').querySelectorAll("tr");

  for (let i = 0; i < rows.length; i++) {
    let row = [];
    const cols = rows[i].querySelectorAll("td, th");
    for (var j = 0; j < cols.length; j++) {
      row.push(cols[j].innerText);
    }
    csv.push(row.join(","));
  }
  console.log(csv.join('\r\n'));
}
table {
  display: none;
}
<table id="table">
  <tr>
    <th>Name</th>
    <th>Age</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Geronimo</td>
    <td>26</td>
    <td>France</td>
  </tr>
  <tr>
    <td>Natalia</td>
    <td>19</td>
    <td>Spain</td>
  </tr>
  <tr>
    <td>Silvia</td>
    <td>32</td>
    <td>Russia</td>
  </tr>
</table>
<button onclick="toCsv()">Export HTML table to CSV file</button>

使用Filesaver将这些CSV字符串下放到文件中。

希望这会有所帮助:)

答案 1 :(得分:0)

您可以尝试以下方法:

const data = [
  [12, "2018-10-10"],
  [123, "city2", "more info"]
];
let csvContent = "data:text/csv;charset=utf-8,";
data.forEach(function(rowArray) {
  let row = rowArray.join(",");
  csvContent += row + "\r\n";
});