How to read a csv file in angularjs

Question

I am trying to read a csv file in angular js and i got through this question How to read csv file content in angular js? where it is used as directive.But i am submitting it as a form in my controler ,so how can i use in my form.Can anyone suggest help.Thanks.

My code,

  if($scope.partner.csv){
          var files = $scope.partner.csv.target.files
           var r = new FileReader();
           r.onload = function(e) {
               var contents = e.target.result;
                $scope.$apply(function () {
                 $scope.fileReader = contents;
               });
          };
        }
      }

This is what i had tried,when i submit my form if csv file is uploaded the above action should be done.

Please provide more specifics about exactly what you are trying to accomplish how this should work — charlietfl, Jan 21 '17 at 14:00
what does "submittiong it as a form in my controoler" mean? not just the fact that the english is wrong; how does a CSV file relate to a form? — Claies, Jan 21 '17 at 14:00
the answer also explains your requirement. http://stackoverflow.com/questions/26353676/how-to-read-csv-file-content-in-angular-js — Aniruddha Das, Jan 21 '17 at 14:19
that's a little clearer, but what is $scope.fileReader supposed to do? this is just going to give you the contents of the CSV file as a string. — Claies, Jan 21 '17 at 14:19
My question is,how can i read csv file according to the example i posted. — MMR, Jan 21 '17 at 14:27
kept *what* for testing purpose? You still aren't clarifying your issue. This code (if it is what you are *really* using, which seems doubtful since it appeared to be a duplicate of the code from the posted answer, variable names and all), reads a file and saves the text of that file as a string. You still haven't explained how this relates to the form you are expecting to submit. — Claies, Jan 21 '17 at 14:30

score 3 · Answer 1 · edited Mar 18 '17 at 23:40

You can use the below code to read csv file.

<!DOCTYPE html>
<html ng-app="" ng-controller="myCtrl">
<style>
table, th, td {
   border: 1px solid black;
   padding:5px;
}
table {
   border-collapse: collapse;
   margin:10px;
}
</style>
<body>
<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>
<script>
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;
    };
}
</script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
</body>
</html>

How to read a csv file in angularjs

1 Answers1