在浏览器中加载JSON文件

时间:2016-08-25 16:33:45

标签: angularjs ng-file-upload

我没有太多的前端经验,所以请耐心等待。

我在浏览器中有一个本地Angular应用程序(没有后端),我想上传一个JSON文件,以便我可以在图表上显示上传的数据。由于我不知道我是否只能从Angular fs.readFile获知,我已选择ng-file-upload以一种很好的方式(从文件浏览器)加载文件。让我知道它是不是正确的工具,但是......

所以我复制了官方JS Fiddle on the repo的代码。不得不修改它以允许我上传任何东西 - 删除验证。

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

作为一个我无能为力的对象出现了反应:

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

如何获取上传/解析JSON文件的实际数据?

1 个答案:

答案 0 :(得分:2)

尝试使用$ http.get获取文件内容,如:

$http.get(response.data).success(function(data) {
    console.log(data);
});