Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/402.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在angularjs中的服务器(django)上上载excel文件?_Javascript_Angularjs_Django - Fatal编程技术网

Javascript 如何在angularjs中的服务器(django)上上载excel文件?

Javascript 如何在angularjs中的服务器(django)上上载excel文件?,javascript,angularjs,django,Javascript,Angularjs,Django,我想在服务器上上传文件,但在实用程序服务中,for循环中有变量files在调试期间未定义,请检查指令是否正确 HTML <input type="file" accept=".xlsx" file-model/> <button ng-click="upload()">upload me</button> 控制器 $scope.upload = function() { var uploadUrl = 'someurl';

我想在服务器上上传文件,但在实用程序服务中,for循环中有变量files在调试期间未定义,请检查指令是否正确

HTML

 <input type="file" accept=".xlsx" file-model/>
 <button ng-click="upload()">upload me</button>
控制器

 $scope.upload = function() {        
      var uploadUrl =  'someurl';
      UtilityService.upload($scope.files, $scope.user, uploadUrl);
  };
服务

app.directive('fileModel', function () {
    return {
        restrict: 'A',
        transclude: true,
        link: function($scope, $element) {
          var fileInput = $element.find('input[type="file"]');
          fileInput.bind('change', function(e) {               
            $scope.notReady = e.target.files.length == 0;
            $scope.files = [];
            for (var i in e.target.files) {
              if (typeof e.target.files[i] == 'object')       
                  $scope.files.push(e.target.files[i]);
            }
          });
        }
    };
  });
function UtilityService($http, $rootScope) {

      var service = {};
      service.upload=upload;

      function upload(files, user, uploadUrl) {
      var formData = new FormData();
      for (var i in files) {
        formData.append('file_' + i, files[i]);
      }

      formData.append("UserId", user.id);
      formData.append("UserRole", user.roles);

      $http({
          method: 'POST',
          url: config.server +uploadUrl,
          enctype: "multipart/form-data",
          data: formData,
          headers: {
            'Content-Type': undefined,
          },
          transformRequest: angular.identity
        })
        .success(function(data, status, headers, config) {
          service.data = data;

        });
    }
    return service;
  }

嗯,我想问题在于这一行-var fileInput=$element.find('input[type=“file”]”)

不知道你为什么要找东西$元素是此处的实际文件输入元素

修改指令-尝试此操作

app.directive('fileModel', function () {
    return {
        restrict: 'A',
        transclude: true,
        link: function($scope, $element) {
          var fileInput = $element;
          fileInput.bind('change', function(e) {               
            $scope.notReady = e.target.files.length == 0;
            $scope.files = [];
            for (var i in e.target.files) {
              if (typeof e.target.files[i] == 'object')       
                  $scope.files.push(e.target.files[i]);
            }
          });
        }
    };
  });

你实际上有两个问题。1表示CORS正在停止请求,2表示您的服务器正在响应一个500。对于第一个问题,请参阅。由于端口不同,浏览器应遵守交叉源策略。请尝试运行带有标志的Chrome--禁用web安全,这将帮助您消除交叉源问题。不过,您应该稍后将访问控制“允许原点”设置为*。@kensplanet谢谢您的回复,我编辑了这个问题,请检查一下。调试期间,未定义文件。。