Angular读取文件内容并显示

小妖666

于 2019-11-09 17:46:55 发布

阅读量5.2k

点赞数

分类专栏： B-JavaScript 文章标签： Angular读取文件内容

本文链接：https://blog.csdn.net/weixin_38883338/article/details/102989723

版权

这篇博客介绍了如何在Angular应用中读取文件内容。通过使用FileReader API，可以将文件转换为base64、字符串、ArrayBuffer或原始二进制格式。在文件成功读取后，利用正则表达式和split方法解析每一行内容，便于进一步处理和显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、读取文件内容

html

<input type="file" accept=".csv,.txt" (change)="openFile($event)">

openFile(event: any): void {
  const input = event.target;
  const reader = new FileReader();
  reader.onload = (() => {
    if (reader.result) {
      console.log(reader.result);
    }
  });
  reader.readAsText(input.files[0], 'utf-8');
}

文件：

大寺，日本，美国，中国，韩国
12，13，14，11，15
23，24，25，23，26
33，34，36，37，34

Log：

最低0.47元/天解锁文章