ビューに表示するためにフェッチしたCSVファイルデータのフォーマット

Question

Angular JSのカスタムディレクティブを使用してCSVファイルから保存された値をフェッチしています。しかし、出てくるデータにはヘッダーが含まれており、UIの最初の列を表示したいだけです。フェッチされることを

サンプルデータ：

Name,Gender,Age,Order,Quantity,Sales 
Adrian ,M,14,10,47,11093 
Adam,M,13,9,33,2954 
Adam,M,14,10,34,1597 
Aaron,F,10,6,28,1302 
Adya ,F,16,12,34,1292 
Aaron,M,9,5,30,839 
Alan,F,11,7,24,756 
Aimee,F,10,6,19,721 

は、ここで私は、ヘッダを削除し、ちょうどUIの[名前]列を表示したいです。

スプリット機能を使用しようとしましたが、新しい行がデータを乱しています。

これはどのように処理することができますか？

ありがとうございます。このyou.Thisを助ける

Answer 1

ホープヘッダ

csv = "heading1,heading2,heading3,heading4,heading5\nvalue1_1,value2_1,value3_1,value4_1,value5_1\nvalue1_2,value2_2,value3_2,value4_2,value5_2", 


$(document).ready(function() { 
    $.ajax({ 
     type: "POST", 
     url: "/echo/html/", 
     dataType: "text", 
     data: { 
      html: csv 
     }, 
     success: function(data) { 
      processData(data); 
     } 
    }); 
}); 

function processData(allText) { 
    var allTextLines = allText.split(/\r\n|\n/); 
    var headers = allTextLines[0].split(','); 
    var lines = []; 

    for (var i=1; i<allTextLines.length; i++) { 
     var data = allTextLines[i].split(','); 
     if (data.length == headers.length) { 

      var tarr = []; 
      for (var j=0; j<headers.length; j++) { 
       tarr.push(headers[j]+":"+data[j]); 
      } 
      lines.push(tarr); 
     } 
    } 
console.log(lines); 
} 

おかげで答えを@kirtanする

http://jsfiddle.net/mblase75/dcqxr/

Answer 2

function myCtrl($scope, $http) { 
$scope.readCSV = function() { 
    // http get request to read CSV file content 
    $http.get('/angular/sample.csv').success($scope.processData); 
}; 

$scope.processData = function(allText) { 
    // split content based on new line 
    var allTextLines = allText.split(/\r\n|\n/); 
    var headers = allTextLines[0].split(','); 
    var lines = []; 

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

}

図

て値を解析しています

<button ng-click="readCSV()"> 
Display CSV as Data Table 
</button> 
<div id="divID"> 
    <table> 
    <tr ng-repeat="x in data"> 
     <td ng-repeat="y in x">{{ y }}</td> 
    </tr> 
    </table> 
</div> 
<div> 
<table> 
</table> 
</div>