angular2 + XLSX 匯出一張工作簿中包含多張表格
1、安裝xlsx包（我使用的npm安裝的）
npm install xlsx
2、使用
（1）在你需要匯出的頁面的 .ts 中引入相關的file.service.ts檔案
import {FileService} from '../../../file.service'; ===》這個檔案的作用就如同它的名字一樣是為表格服務的
（2）依賴注入
（3）匯出檔案
關於匯出表格的資料什麼的我就不進行詳細的贅述了，主要是呼叫你封裝在 file.service.ts 中的 multiDownLoadExl() 函式，這個函式的是我們自己寫的。裡面的引數根據的你的需要來新增，下面只有我需要使用的引數。
下面我會對裡面用到的引數進行一一的講解
that
JSON陣列中的一個大陣列 [ ] 代表一個表格，大陣列中的 { } 代表一行資料
that.selectedAllAlarnList = {
'001': [
{'目錄': ' 1 ', '名稱': ' 1 ', '說明': ' 1 ' },
{'目錄': ' 1 ', '名稱': ' 1 ', '說明': ' 1 ' },
{'目錄': ' 1 ', '名稱': ' 1 ', '說明': ' 1 ' }
],
'002': [
{'目錄': ' 1 ', '名稱': ' 1 ', '說明': ' 1 ' },
{'目錄': ' 1 ', '名稱': ' 1 ', '說明': ' 1 ' },
{'目錄': ' 1 ', '名稱': ' 1 ', '說明': ' 1 ' }
],
'003': [
{'目錄': ' 1 ', '名稱': ' 1 ', '說明': ' 1 ' },
{'目錄': ' 1 ', '名稱': ' 1 ', '說明': ' 1 ' },
{'目錄': ' 1 ', '名稱': ' 1 ', '說明': ' 1 ' }
]
}
fillName ===》就是你匯出的工作簿的名字（就是檔名）
longestList ===》這是我們根據需要設定的單元格列寬，因為匯出的表格的寬度都是預設的，不符合我的要求。
要記住單元格的寬度是一個一個單元格設定的。一個行單元格的寬度一個數組。根據我的實踐證明，設定寬度的幾個變數只有
wch有效，wch代表多少個字元。
格式：
longestList = {
'001': [ { wch: 15 } ，{ wch: 15 }，{ wch: 15 } ]，
'002': [ { wch: 15 } ，{ wch: 15 }，{ wch: 15 } ]，
'003': [ { wch: 15 } ，{ wch: 15 }，{ wch: 15 } ]
}
rowPropList ===》這是我們根據需要設定的單元格列高，因為匯出的表格的高度都是預設的，不符合我的要求。
rowPropList 的格式跟longestList 是一樣的。要求跟設定列寬也差不多。
mergesList ===》 這個引數是是用來設定你需要合併單元格的。
s =>是起始單元格；e => 是結束單元格；c => 是第幾行；r => 是第幾列
格式：
merges = [ {s: {c: 0, r: 0}, e: {c: 3, r: 0}}, {s: {c: 0, r: 3}, e: {c: 3, r: 3}}, {s: {c: 0, r: 4}, e: {c: 3, r: 4}} ];
sheetNames ===》這個引數是用來設定sheetName的，一個sheetName代表一個表格，就是下面這個東西 ：
格式：
sheetNames = [ 'sheet1'，'sheet2' ，'sheet3' ]
以上是我對函式中需要使用的引數的一個解釋說明，接下來我對我的multiDownLoadExl函式繼續解說：
下面就是我寫的函式：
multiDownLoadExl(dataAll, fileName, colProp, rowProp, merges, sheetNames) { let i = 0; const wb: XLSX.WorkBook = {SheetNames: sheetNames, Sheets: {}, Props: {}}; for (const item in dataAll) { const toSet = XLSX.utils.json_to_sheet(dataAll[item], {skipHeader: true}); wb.Sheets[sheetNames[i]] = toSet; // 通過json_to_sheet轉成單頁(Sheet)資料 const wsname: string = wb.SheetNames[i]; const ws: XLSX.WorkSheet = wb.Sheets[wsname]; ws['!cols'] = colProp[item]; //單元格寬度 ws['!rows'] = rowProp[item]; //列高 ws['!merges'] = merges[item]; //合併單元格 i++; } fileName += '.' + this.wopts.bookType; this.saveAs( new Blob([this.s2ab(XLSX.write(wb, {bookType: 'xlsx', bookSST: false, type: 'binary'}))], {type: ''}), fileName); }因為這是一個工作簿中包含多個表格，因此需要進行一個for迴圈，記住JSON陣列的for迴圈是用 for...in.. 。
XLSX.utils.json_to_sheet ===》將JSON陣列轉換為表格格式；
skipHeader ===》 表格是否需要標題，根據自己的需求而定；
saveAs函式：
// saveAs呼叫在本地機器上下載檔案 saveAs(obj, fileName) {//當然可以自定義簡單的下載檔案實現方式 const tmpa = document.createElement('a'); tmpa.download = fileName || '下載'; tmpa.href = URL.createObjectURL(obj); //繫結a標籤 tmpa.click(); //模擬點選實現下載 setTimeout(function () { //延時釋放 URL.revokeObjectURL(obj); //用URL.revokeObjectURL()來釋放這個object URL }, 100); }
s2ab() 函式：// 字串轉字元流
s2ab(s) { // console.log(s); if (typeof ArrayBuffer !== 'undefined') { const buf = new ArrayBuffer(s.length); const view = new Uint8Array(buf); for (let i = 0; i !== s.length; ++i) { view[i] = s.charCodeAt(i) & 0xFF; } return buf; } else { const buf = new Array(s.length); for (let i = 0; i !== s.length; ++i) { buf[i] = s.charCodeAt(i) & 0xFF; } return buf; } }
建議：
參考xlsx的官網文件使用
xlsx-style用於設定xlsx表格的樣式的。
提示：
（1）cell.s無效（也就是說通過cell.s來設定表格的相關字型樣式無效）
（2）在fill.service.ts中記得引入xlsx ==》 import * as XLSX from 'xlsx';
xlsx官網地址：https://www.npmjs.com/package/xlsx
xlsx-style官網地址：https://www.npmjs.com/package/xlsx-style