相关疑难解决方法(0)

FileReader没有使用AngularJS正确加载文件

我正在尝试将一个csv文件加载到AngularJS中,以便我可以对内容进行一些操作.它不像我想要的那样工作.为了测试它是否正确加载,我将它加载到textarea中以查看内容.

当我加载文件时,它说它已正确加载但是onload()事件似乎没有触发,直到我加载第二个CSV文件,在这种情况下FIRST文件显示在textarea中.

HTML:

<div>
  <input ng-model="csv"
            onchange="angular.element(this).scope().fileChanged()"
            type="file" accept=".csv" id="fileInput"/>
</div>
<br/>
<div>
  <textarea ng-model="csvFile" readonly="true" style="width:99%; height:500px" disabled></textarea>
</div>
Run Code Online (Sandbox Code Playgroud)

JS:

$scope.fileChanged = function() {

  $scope.$apply(function() {
      var csvFileInput = document.getElementById('fileInput');
      var reader = new FileReader();
      var csvFile = csvFileInput.files[0];
      reader.onload = function(e) {
          $scope.csvFile = reader.result;
      };
      reader.readAsText(csvFile);
  });
};
Run Code Online (Sandbox Code Playgroud)

当我把它放到JSFiddle中时,文件根本不会出现在textarea中.我是JSFiddle的新手,所以我不知道为什么会这样.

任何帮助都将不胜感激.

html javascript filereader angularjs

6
推荐指数
1
解决办法
2万
查看次数

标签 统计

angularjs ×1

filereader ×1

html ×1

javascript ×1