2017-03-15 2 views
6

파일 업 로더 입력을 사용하여 업로드 한 CSV 파일에서받은 데이터로 JSON 파일을 만들려고합니다.CSV to JSON to Typescript

자바 스크립트에서이 일을하는 게시물이 많이 있지만 Typescript에서 저에게 잘 작동하지 않습니다.

아래 코드를 실행하면 오류가 발생합니다. csv.Split이 함수가 아닙니다. 코드 작성 방법을 변경하는 방법은 없습니다.

추가 정보가 필요하고 미리 감사드립니다.

component.ts

public testFile() { 
    var file = (<HTMLInputElement>document.getElementById('fileInput')).files[0];   

    var jsonFile = this.csvJSON(file); 


    // Set Http POST options 
    let headers = new Headers({ 'Content-Type': 'application/json' }); 
    let options = new RequestOptions({ headers: headers }); 

    // Call Api with test connection data 
    this.http 
     .post('/api/TestConnection/TestConnection', jsonFile, options) 
     .subscribe(data => { 
      // alert request ok 
      alert('ok'); 
     }, error => { 
      // Log error 
      console.log(error.json()); 
     }); 
} 

public csvJSON(csv) { 
    var lines = csv.split("\n"); 

    var result = []; 

    var headers = lines[0].split(","); 

    for (var i = 1; i < lines.length; i++) { 

     var obj = {}; 
     var currentline = lines[i].split(","); 

     for (var j = 0; j < headers.length; j++) { 
      obj[headers[j]] = currentline[j]; 
     } 

     result.push(obj); 

    } 

    //return result; //JavaScript object 
    return JSON.stringify(result); //JSON 
} 
+0

csv의 데이터를 해시 테이블 (배열)에 부어 json으로 변환하면 더 쉽지 않습니까? – IvRRimUm

+0

확실히 더 나은 방법이 될 수 있습니다. 정확하게 제가 조언을 구하는 이유입니다. –

+0

Okey, 현재 코드에서 어떤 오류가 발생합니까? – IvRRimUm

답변

3

당신은 File 방법 대신 파일의 텍스트 csvJSON에 전달된다. FileReader을 사용하여 내용을 읽을 수 있습니다. 여기에 예를

const convertFile =() => { 
 
    const input = document.getElementById('fileInput'); 
 

 
    const reader = new FileReader(); 
 
    reader.onload =() => { 
 
    let text = reader.result; 
 
    console.log('CSV: ', text.substring(0, 100) + '...'); 
 
    
 
    //convert text to json here 
 
    //var json = this.csvJSON(text); 
 
    }; 
 
    reader.readAsText(input.files[0]); 
 
};
<input type='file' onchange='convertFile(event)' id='fileInput'>

+0

대단히 고마워요. –

0

HTML

<input type="file" accept=".csv (change)="csv2Array($event)"> 

에게

타이프 라이터를의 0
csv2Array(fileInput: any){ 
//read file from input 
this.fileReaded = fileInput.target.files[0]; 

let reader: FileReader = new FileReader(); 
reader.readAsText(this.fileReaded); 

reader.onload = (e) => { 
let csv: string = reader.result; 
let allTextLines = csv.split(/\r|\n|\r/); 
let headers = allTextLines[0].split(','); 
let lines = []; 

    for (let i = 0; i < allTextLines.length; i++) { 
    // split content based on comma 
    let data = allTextLines[i].split(','); 
    if (data.length === headers.length) { 
     let tarr = []; 
     for (let j = 0; j < headers.length; j++) { 
     tarr.push(data[j]); 
     } 

    // log each row to see output 
    console.log(tarr); 
    lines.push(tarr); 
    } 
} 
// all rows in the csv file 
console.log(">>>>>>>>>>>>>>>>>", lines); 
} 
}