在Angular 7中,可以使用FileReader
对象读取输入导入的srt或csv文件中的数据,并将其保存到数组中。下面是一个示例代码:
首先,确保已经安装了@types/file-saver
库,可以使用以下命令进行安装:
npm install @types/file-saver
接下来,在组件中导入所需的库和模块:
import { Component, OnInit } from '@angular/core';
import { saveAs } from 'file-saver';
@Component({
selector: 'app-file-reader',
templateUrl: './file-reader.component.html',
styleUrls: ['./file-reader.component.css']
})
export class FileReaderComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
onFileSelected(event: any): void {
const file: File = event.target.files[0];
const fileReader: FileReader = new FileReader();
fileReader.onload = (e: any) => {
const fileContent: string = e.target.result;
// 处理文件内容,将其保存到数组中或进行其他操作
const dataArray: string[] = fileContent.split('\n');
console.log(dataArray);
};
fileReader.readAsText(file);
}
}
在上述示例中,onFileSelected()
方法会在选择文件后触发。它获取选定的文件,并创建一个FileReader
对象。然后,通过readAsText()
方法将文件内容读取为文本。当读取完成时,将触发onload
事件处理程序,其中可以对文件内容进行处理。在示例中,我们将文件内容按行拆分,并将每行保存到名为dataArray
的数组中。
此外,可以使用npm install file-saver
命令安装file-saver
库,以便在处理完文件后将结果保存为新文件。使用saveAs()
函数可以实现这一点。例如,如果要将数组保存为新的CSV文件:
import { saveAs } from 'file-saver';
...
onSave(): void {
const dataArray: string[] = ['item1', 'item2', 'item3'];
const csvContent: string = dataArray.join(',');
const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8' });
saveAs(blob, 'data.csv');
}
在上述示例中,我们首先将数组dataArray
转换为逗号分隔的CSV字符串csvContent
。然后,创建一个Blob
对象,将字符串内容传递给它,并指定MIME类型。最后,使用saveAs()
函数将Blob
保存为名为data.csv
的文件。
请注意,示例代码中没有提及特定的腾讯云产品或链接地址,因为该问题并未要求涉及这方面的内容。
领取专属 10元无门槛券
手把手带您无忧上云