如何在angularjs中上傳服務器上的excel文件（django）？

我想在服務器上傳文件，但在Utility Service中有變量文件 for循環在調試時未定義，請檢查指令是否正確。如何在angularjs中上傳服務器上的excel文件（django）？

HTML

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

fileModel指令

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]); 
      } 
      }); 
     } 
    }; 
    });

控制器

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

服務

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; 
    }

來源

2015-11-16 geeks

你確實有2個問題。 1是CORS正在停止請求，2是你的服務器正在響應一個500.對於你的第一個問題，請參閱http://stackoverflow.com/questions/18642828/origin-http-localhost3000-is-not-allowed -by的訪問控制允許來源。 – tcooc

由於您的端口不同，您的瀏覽器正在考慮它應該遵循的跨域策略。 – kensplanet

嘗試使用標誌** - disable-web-security **運行Chrome，它應該可以幫助您擺脫Cross來源問題。但是，您應該稍後將Access-Control-Allow-Origin設置爲*。 – kensplanet

嗯，我想這個問題是這一行 - 變種的FileInput = $ element.find（ '輸入[類型= 「文件」]'）;

不知道爲什麼你需要找到任何東西。 $ element是這裏的實際文件輸入元素。

修改指令 - 試試這個

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]); 
      } 
      }); 
     } 
    }; 
    });

來源

2015-11-16 22:51:28 kensplanet

如何在angularjs中上傳服務器上的excel文件（django）？

回答

相關問題