2017-03-15 13 views
6

ファイルアップローダの入力を使用してアップロードされたCSVファイルから受信したデータからJSONファイルを作成しようとしています。CSV to TypescriptのJSON

私はJavascriptでこれをやっている投稿をたくさん見つけましたが、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

あなたが代わりにファイルのテキストのcsvJSON方法にFileを渡しています。 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)"> 

は活字体

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); 
} 
}