1

I don't have much front-end experience, so please bear with me.

I have a local Angular app in browser (no back-end) and I want to upload a JSON file so that I can show the uploaded data on graphs. Since I don't know if I can just fs.readFile from Angular, I've chosen ng-file-upload to load the file in a nice way (from the file browser). Let me know if it isn't the right tool, though...

So I've copied the code from the official JS Fiddle on the repo. Had to modify it a bit to allow me upload anything -- remove validations. 

var app = angular.module('app', ['ngFileUpload']);

app.controller('fileUploader', ['$scope', 'Upload', '$timeout', function ($scope, Upload, $timeout) {
  $scope.uploadFiles = function(file, errFiles) {
    $scope.f = file;
    $scope.errFile = errFiles && errFiles[0];
    if (file) {
      file.upload = Upload.upload({
        url: 'https://angular-file-upload-cors-srv.appspot.com/upload',
        data: {file: file}
      });

      file.upload.then(function (response) {
        $timeout(function () {  // don't know why this timeout 
         $scope.fileReady = true;
         file.result = response.data;

         // can't figure out what to do with this!!!
         console.log('response.data:\n', JSON.stringify(response.data.result, null, 2));
        });
      }, function (response) {
        if (response.status > 0)
          $scope.fileError = response.status + ': ' + response.data;
      });
    }
  };
}]);

The response comes out as an object I can't do much with:

 [
  {
    "fieldName": "file",
    "name": "my-awesome-data.json",
    "size": "364077"
  }
]

How do I get the actual data that was uploaded / parse the JSON file?

sakovias
  • 1,356
  • 1
  • 17
  • 26
  • 1
    Yeah, perhaps `ng-file-uploader` is not the right tool for local files. Here's a much more simple solution: http://stackoverflow.com/questions/26165919/filereader-not-loading-file-properly-using-angularjs – sakovias Aug 25 '16 at 17:36

1 Answers1

2

Try to get the file content using $http.get like:

$http.get(response.data).success(function(data) {
    console.log(data);
});
Flavio Misawa
  • 171
  • 3