首页 > 解决方案 > Angular 7,如何从输入导入的 srt 或 csv 文件中读取数据,并保存在数组中?

问题描述

感谢大家为我贡献自己的时间。我试图通过输入框上传文件( csv 或 srt ),并保存到数组。我在控制台上成功读取文件,但无法保存到数组。我怎么可能做到?请任何人帮助我。这是我的代码。

  public onFilechange(event: any) {
 
    let fileReader = new FileReader()
    //fileReader.readAsText(event.target.files[0])

    let result: any
    fileReader.onload = function (event) {
      result = (event.target as any).result
      return result
    }
    this.temporarySavingSubtitle = fileReader.readAsText(event.target.files[0])
    console.log(this.temporarySavingSubtitle) 
  }

我希望我能在控制台日志上看到结果,但什么也没显示。请帮忙!

标签: javascriptangularfilereader

解决方案


从代码中,我没有找到从文件(类似于流)中获取数据的方法。我相信您需要 js-xlsx.js(还有其他库)将文件流解析为 json。当你得到 json 时,按照你提到的那样保存到数组中。

单张纸的一些关键代码。

import * as xlsx from 'xlsx';

const _readExcelAsync = (file) => {
    return new Promise((resolve) => {
        const reader = new FileReader();
        reader.onload = (event) => {
            const data = event.target.result,
                wb = xlsx.read(data, { type: 'binary' }),
                result = {};
            wb.SheetNames.forEach(sheet => {
                const roa = xlsx.utils.sheet_to_json(wb.Sheets[sheet], { header: 1 });
                if (roa.length) result[sheet] = roa;
            });
            resolve(Object.values(result)[0]);
        };
        reader.readAsBinaryString(file);
    });
}

export async function processFile(file) {
    try {
        return await _readExcelAsync(file);
    } catch(err) {
        console.log(err);
    }
}

const content = yield call (processFile, file); // file is event.target.files[0]


推荐阅读