如何使用Excel.js导入Angular中的EXCEL文件 [英] How to import EXCEL file in angular using exceljs

查看:709
本文介绍了如何使用Excel.js导入Angular中的EXCEL文件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想使用角度代码读取Excel文件. 我的文件存储在本地系统的某个位置,例如C:/data/test.xlsx

I want to read excel file using angular code. my file is stored somewhere in my local system e.g, C:/data/test.xlsx

我已经尝试加载 readFile()& exceljs的load()方法.

I have already tried loading with readFile() & load() methods of exceljs.

他们什么都没读,反而给了错误

they fail to read anything, instead they give error

推荐答案

我找到了从Angular代码读取Excel文件的方法.转换文件 放入 ArrayBuffer 并使用 exceljs

I found the way to read excel file from Angular code. Convert the file into ArrayBuffer and read it using exceljs

  1. 在有角度的服务/组件
  2. 中导入Exceljs
  1. Importing Exceljs in angular service/component

    import * as Excel from 'exceljs/dist/exceljs.min.js';


  1. 修改tsconfig.app.json

    compilerOptions: {
       paths": {
             "exceljs": [
               "node_modules/exceljs/dist/exceljs.min.js"
             ]
          }
     }

  1. 从html代码打开文件.

    <input id="uploadBtn" type="file" (change)="readExcel($event)" 
           class="upload input-common" required />


  1. 使用exceljs读取文件.

    readExcel(event) {
        const workbook = new Excel.Workbook();
        const target: DataTransfer = <DataTransfer>(event.target);
        if (target.files.length !== 1) {
          throw new Error('Cannot use multiple files');
        }

        /**
         * Final Solution For Importing the Excel FILE
         */

        const arryBuffer = new Response(target.files[0]).arrayBuffer();
        arryBuffer.then(function (data) {
          workbook.xlsx.load(data)
            .then(function () {

              // play with workbook and worksheet now
              console.log(workbook);
              const worksheet = workbook.getWorksheet(1);
              console.log('rowCount: ', worksheet.rowCount);
              worksheet.eachRow(function (row, rowNumber) {
                console.log('Row: ' + rowNumber + ' Value: ' + row.values);
              });

            });
        });
      }

polyfill.ts也必须按此顺序引用. import 'exceljs/dist/exceljs.min.js'; import 'zone.js/dist/zone';

Also polyfill.ts must reference in this sequence .. import 'exceljs/dist/exceljs.min.js'; import 'zone.js/dist/zone';

这篇关于如何使用Excel.js导入Angular中的EXCEL文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆