angular-file-upload没有发布任何内容

时间:2015-02-06 12:18:10

标签: angularjs angular-file-upload

我正在尝试使用angular-file-upload。该文件正从视图发送到角度控制器,但它没有向apiController发送任何内容。我做了一个傻瓜。

Plunker

将文件丢弃在

$scope.upload = function (files) {
      $scope.$watch('files', function () {
    $scope.upload($scope.files);
});

$scope.upload = function (files) {
    if (files && files.length) {
        for (var i = 0; i < files.length; i++) {
            var file = files[i];
            $upload.upload({
                url: 'https://angular-file-upload-cors-srv.appspot.com/upload',
                fields: { 'companyName': $scope.companyName },
                file: file
            }).progress(function (evt) {
                var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
                console.log('progress: ' + progressPercentage + '% ' + evt.config.file.name);
            }).success(function (data, status, headers, config) {
                console.log('file ' + config.file.name + 'uploaded. Response: ' + data);
            });
        }
    }
};

更新

我看到你的成功功能如何被击中。我的仍然不是。并且我的控制台中没有javascript错误。我该怎么做才能调试呢?

1 个答案:

答案 0 :(得分:2)

由于$ scope.files是数组,你需要将$ watch函数的第三个参数设置为'true'

   $scope.$watch('files', function () {
      console.log($scope.files);
        $scope.upload($scope.files);
    }, true);

请参阅此处的工作演示

http://plnkr.co/edit/lGjgTIeVZdgxcS2kaE7p?p=preview

app.controller('MainCtrl', function($scope, $upload) {
  $scope.$watch('files', function() {
    $scope.upload($scope.files);
  });

  $scope.upload = function(files) {
    if (files && files.length) {
      for (var i = 0; i < files.length; i++) {
        var file = files[i];
        $upload.upload({
          url: 'https://angular-file-upload-cors-srv.appspot.com/upload',
          fields: {
            'companyName': $scope.companyName
          },
          file: file
        }).progress(function(evt) {
          var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
          console.log('progress: ' + progressPercentage + '% ' + evt.config.file.name);
        }).success(function(data, status, headers, config) {
          console.log('file ' + config.file.name + 'uploaded. Response: ');
         //response from server          
         console.log(data);
        });
      }
    }
  };
});