如何使用$ resource在AngularJS中上传文件？

Question

我想用$ resource的AngularJS从客户端上传文件。

需要将FormData发送到服务器。

我用下面的代码试图

MyFile.tpl.html

<input file-model="uploadingfile" type="file"/><br/> 

MyDirective.js

angular.module('upload.upload', [ 
]) 

.directive('fileModel', ['$parse', function ($parse) { 
    return { 
    restrict: 'A', 
    link: function(scope, element, attrs) { 
     var model = $parse(attrs.fileModel); 
     var modelSetter = model.assign; 

     element.bind('change', function(){ 
      scope.$apply(function(){ 
       modelSetter(scope, element[0].files[0]); 
      }); 
     }); 
    } 
}; 
    }]); 

MyController.js

var myservercall = $resource("my/rest/path/:filename", { filename: '@filename'}); 

var file = $scope.uploadingfile; 
var fd = new FormData(); 
fd.append('upload', file); 
myservercall.save({filename: file.name}, here i don't know how to send the form data); 

我如何做这个工作？

Answer 1

您可以使用FileReader()来获取添加到文件输入元素的文件的数据。有许多方法可以实现它，但是这会让您访问需要发布到api的数据。