以角度读取excel文件，标题为第n行答案

【问题标题】：Reading excel file in angular with header at row number n以角度读取excel文件，标题为第n行
【发布时间】：2020-04-27 17:36:54
【问题描述】：

我想从行号 5 （比如）开始以角度读取 excel 文件作为标题并读取标题为 'colName1', 'colName2 ' 和 'colName3' （如果无法用这么多规范读取，则根据规范获取数据切片）。有没有简单的方法来做到这一点？我遇到的所有代码都使用多个嵌入式脚本来完成这项工作。

这是我想出的代码。它读取选定的 excel 并在控制台中显示它的 JSON。它无法处理标题不在第一行且不读取指定列的文件。

HTML：

<div class="col-md-8 form-group">    
   <input type="file" class="form-control" (change)="uploadedFile($event)" placeholder="Upload file" accept=".xlsx">
</div>

TypeScript：

import { Component, OnInit } from '@angular/core';
import * as XLSX from 'xlsx';  
import * as FileSaver from 'file-saver'; 

@Component({
  selector: 'app-upload',
  templateUrl: './upload.component.html',
  styleUrls: ['./upload.component.css']
})
export class UploadComponent implements OnInit {

  constructor() { }

  ngOnInit(): void {
  }
  storeData: any;  
  jsonData: any;    
  fileUploaded: File;  
  worksheet: any;  

  uploadedFile(event) {  
    this.fileUploaded = event.target.files[0];  
    this.readExcel();  
  }  

  readExcel() {  
    let readFile = new FileReader();  
    readFile.onload = (e) => {  
      this.storeData = readFile.result;  
      var data = new Uint8Array(this.storeData);  
      var arr = new Array();  
      for (var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);  
      var bstr = arr.join("");  
      var workbook = XLSX.read(bstr, { type: "binary" });  
      var first_sheet_name = workbook.SheetNames[0];  
      this.worksheet = workbook.Sheets[first_sheet_name];  
      this.jsonData = XLSX.utils.sheet_to_json(this.worksheet, { raw: false });  
      this.jsonData = JSON.stringify(this.jsonData);  
      console.log(this.jsonData)
    }  
    readFile.readAsArrayBuffer(this.fileUploaded);  
  }
}

我正在寻找类似于 Python 中 pandas 提供的行为：

df = pd.read_excel('fileName.xlsx', sheet_name='sheet1', header=5)
df = df[['colName1','colName2', 'colName3']].copy()

我是 Angular 的新手，但仍在尝试摆脱 Angular 的基础知识。

【问题讨论】：

标签： javascript excel angular typescript frontend

【解决方案1】：

最简单的方法是使用 awesome lib xlsx-import https://github.com/Siemienik/xlsx-import

它适用于 TypeScript，因此非常适合您的 Angular 应用：

interface Book {
    Id: number;
    Title: string;
    Author: string;
}

const importer = new Importer(workbook);
const books: Book[] = importer.GetAllItems<Book>( {
    type: 'list',
    worksheet: 'Favourites',
    columns: [
        {
            index: 1, // column index (1,2,3....n) - started form number 1 (not 0)
            key: 'Id', // output item's field (Book.Id)
            mapper: (v: string) => Number.parseInt(v) // nullable, for transformating values
        },
        {index: 2, key: 'Title'}, // (Book.Title)
        {index: 5, key: 'Author'},  // (Book.Author)
    ],
    rowOffset: 6, //offset header row
});

【讨论】：