如何在AngularJS中上傳文件？

Question

無法使用AngularJS創建文件上傳。 有一種形式：

<form ng-submit="getElem()" ng-repeat="elem in elems" class="update-form">
    <label for="name">Elem name: {{elem.name}}</label>
    <input type="file" id="file" name="file" />
    <button type="button" ng-click="addImage()" class="btn btn-success">
        <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
        Add
    </button>
</form>

我在AngularJS中有一個方法：

 $scope.addImage = function () {
        $scope.data = 'none';
            var f = document.getElementById('file').files[0],
                r = new FileReader(),
                currentElem = this.elem.id;
            r.onloadend = function(e){
                $scope.data = e.target.result;
                var updateUrl = 'https://example/find' + currentElem + '/images';
                    $http.post(updateUrl, $scope.data)
                        .success(function (data, status, headers, config) {
                            console.info('Update image fine!');
                        });
            }
            r.readAsBinaryString(f);

單擊“添加”按鈕后，出現錯誤“ TypeError：無法在'FileReader'上執行'readAsBinaryString'：參數1不是'Blob'類型。” 為什么會這樣？ 以及由於需要上傳文件，我該如何解決？

Answer 1

嘗試以下功能

 $scope.add = function(){
  var f = document.getElementById('file').files[0],
      r = new FileReader();
  r.onloadend = function(e){
    var data = e.target.result;
    //send you binary data via $http or $resource or do anything else with it
  }
  r.readAsBinaryString(f);
}