angularjs FileReader返回undefined

Question

我似乎无法从上传文件中获取文本字符串。之前它曾在我的控制器中工作。不知何故，它停止工作，console.log（$ scope.importFile）显示'undefined'。我对处理文件上传和angularjs都不熟悉。你能帮助找出问题所在吗？

我的指令和控制器以及HTML：

app.directive('fileReader', function() {
  return {
    scope: {
      fileReader:"="
    },
    link: function(scope, element) {
      $(element).on('change', function(changeEvent) {
        var files = changeEvent.target.files;
        //console.log(files.length);
        
        if (files.length) {
          var r = new FileReader();
          r.onload = function(e) {
              var contents = e.target.result;
              scope.$apply(function () {
                scope.fileReader = contents;
              });
              //console.log(scope.fileReader + ' in onload');
              //r.readAsText(files[0]);
          };
          console.log('using file-reader directive');
          console.log(r.readAsText(files[0]));
          r.readAsText(files[0]);
        }
      });
    }
  };
});



app.controller('NavController', function($scope, $location, $modal, toaster) {
  
  $scope.selectFile = function () {
      console.log('print upload: '+ $scope.importFile );
      alert('print upload: '+ $scope.importFile);
  };
};

<div class="form-group">             
   <input type="file" file-reader="importFile" class="form-control"/><br>      
 </div>     
 
<div class="form-group">
 <label>
   <input class="pull-left text-left col-sm-1 control-label" type="checkbox" ng-model="confirmDeleteMode">
     <span class="glyphicon glyphicon-trash col-sm-10 pull-left text-left">
       <em style="color:red">By checking this box, I understand....</em>
     </span>  
  </label>
</div>
         
<div class="form-group">       
   <input type="button" value="Upload File" class="btn btn-inverse" ng-click="selectFile()" ng-disabled="!confirmDeleteMode">
         
  <button class="btn btn-default" type="button" ng-click="cancel()">Cancel</button>
</div>