title: How to convert the loaded csv data to JSon object in AngularJS
body: <p>I have to load a CSV file using upload and then use the contents of this file(converted to JSON) to call a REST Interface using $http post request. This request wants input data in JSON format.</p>
  
  <p>Please suggest me how to do the same. I have tried the following as of now. I am able to load the file and read its content. How to create the JSON onject from the same. Code as follows:</p>
  
  <p>'use strict';</p>
  
  <p>angular.module('myApp', [])</p>
  
  <pre><code>.controller('fupController', function ($scope, $http) {
  
      $scope.data = '';
      $scope.toJSON = '';
  
      $scope.add = function(){
          console.log("Add called");
          var csvFile = document.getElementById('file').files[0],
              reader = new FileReader();
          reader.onloadend = function(e){
              var data = e.target.result;
              console.log("File Name: ", document.getElementById('file').files[0].name);
  
              $scope.data = e.target.result;
  
              // Trying to convert to JSON object
              $scope.toJSON = angular.toJson($scope.data);
  
              console.log("Json Data: ", $scope.toJSON);
  
              // --&gt; $http POST request with the JSON onject as input data
          }
  
         reader.readAsText(csvFile);
      }
  });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>              &lt;div class="form-group"&gt;
                    &lt;label&gt;Select File to upload&lt;/label&gt;
                    &lt;div ng-controller="fupController"&gt;
                        &lt;input type="file" id="file" name="file" accept=".csv"/&gt;
                        &lt;input type="button" ng-click="add()" value="Upload" /&gt;
                    &lt;/div&gt;
                &lt;/div&gt;
  </code></pre>