您好evreryone,我是Angular的新用户,我正在尝试导入CSV 使用Typescript 3.2.2使用Angular 7生成文件,但出现错误。 可以帮忙一下吗?这是我正在尝试的第一个解决方案
这是我的app.components.ts文件
import {Component, ViewChild, OnInit} from '@angular/core';
declare var $;
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit{
@ViewChild('dataTable') table;
dataTable: any;
dtOption: any = {};
title = 'Aegon Script Generation';
constructor(){
}
ngOnInit(): void
{
this.dtOption = {
"paging": false,
"ordering": true,
"scrollY": '50vh',
"scrollX": true,
"info": false
};
this.dataTable = $(this.table.nativeElement);
this.dataTable.DataTable(this.dtOption);
}
/**This method will be used to check if the selected file is a valid CSV file or not */
isCSVFile(file: any)
{
return file.name.endsWith(".csv");
}
/**This method will fetch the first row of the CSV file as the headers list for the result and return the list to the calling function.*/
getHeaderArray(csvRecordsArr: any)
{
let headers = csvRecordsArr[0].split(',');
let headerArray = [];
for (let j = 0; j < headers.length; j++) {
headerArray.push(headers[j]);
}
return headerArray;
}
/**This method will iterate over each row of CSV file skipping the first row which is the header. On each iteration
only the rows with columns equal to header numbers will be pushed to the main record.*/
getDataRecordsArrayFromCSVFile(csvRecordsArray: any, headerLength: any)
{
var dataArr = []
for (let i = 1; i < csvRecordsArray.length; i++) {
let data = csvRecordsArray[i].split(',');
/**FOR EACH ROW IN CSV FILE IF THE NUMBER OF COLUMNS
ARE SAME AS NUMBER OF HEADER COLUMNS THEN PARSE THE DATA */
if (data.length == headerLength) {
var csvRecord: CSVRecord = new CSVRecord();
csvRecord.firstName = data[0].trim();
csvRecord.lastName = data[1].trim();
csvRecord.email = data[2].trim();
csvRecord.phoneNumber = data[3].trim();
csvRecord.title = data[4].trim();
csvRecord.occupation = data[5].trim();
dataArr.push(csvRecord);
}
}
return dataArr;
}
/**This method is called on the file selection. It uses FileReader to parse the input CSV file an then makes use
of the previous 3 methods discussed above to Confirm if the files selected is a CSV file if yes then accordingly
fetch the Headers and Row data from the file.*/
fileChangeListener($event: any): void
{
var text = [];
var files = $event.srcElement.files;
if (this.isCSVFile(files[0])) {
var input = $event.target;
var reader = new FileReader();
reader.readAsText(input.files[0]);
reader.onload = (data) => {
let csvData = reader.result;
let csvRecordsArray = csvData.split(/\r\n|\n/);
let headersRow = this.getHeaderArray(csvRecordsArray);
this.csvRecords =
this.getDataRecordsArrayFromCSVFile(csvRecordsArray,
headersRow.length); }
reader.onerror = function() {
alert('Unable to read' + input.files[0]);
};
} else {
alert("Please import valid .csv file.");
this.fileReset();
}
}
}
这是我的错误 我试图将lib conf更改为tsconfig.json
ERROR in src/app/app.component.ts(62,40): error TS2304: Cannot find name 'CSVRecord'.
src/app/app.component.ts(62,56): error TS2552: Cannot find name 'CSVRecord'. Did you mean 'csvRecord'?
src/app/app.component.ts(91,53): error TS2339: Property 'split' does not exist on type 'string | ArrayBuffer'.
Property 'split' does not exist on type 'ArrayBuffer'.
src/app/app.component.ts(93,28): error TS2339: Property 'csvRecords' does not exist on type 'AppComponent'.
src/app/app.component.ts(102,29): error TS2339: Property 'fileReset' does not exist on type 'AppComponent'.