angularjs ve yay mvc - bir istekte birden fazla dosya yükleme

Question

Web uygulamasında dosya yükleme uygulamak istiyorum, istemci tarafında angular.js ve sunucu tarafında spring mvc kullanıyorum.

https://github.com/danialfarid/angular-file-upload numaralı telefonu kullanarak tek dosya yükleme ve çoklu dosya yükleme işlemlerini yapmayı başardım.

//inject angular file upload directives and service. 
angular.module('myApp', ['angularFileUpload']); 

var MyCtrl = [ '$scope', '$upload', function($scope, $upload) { 
    $scope.onFileSelect = function($files) { 
    //$files: an array of files selected, each file has name, size, and type. 
    for (var i = 0; i < $files.length; i++) { 
     var $file = $files[i]; 
     $scope.upload = $upload.upload({ 
     url: 'server/upload/url', //upload.php script, node.js route, or servlet url 
     // method: POST or PUT, 
     // headers: {'headerKey': 'headerValue'}, withCredential: true, 
     data: {myObj: $scope.myModelObj}, 
     file: $file, 
     //(optional) set 'Content-Desposition' formData name for file 
     //fileFormDataName: myFile, 
     progress: function(evt) { 
      console.log('percent: ' + parseInt(100.0 * evt.loaded/evt.total)); 
     } 
     }).success(function(data, status, headers, config) { 
     // file is uploaded successfully 
     console.log(data); 
     }) 
     //.error(...).then(...); 
    } 
    } 
}]; 

tüm dosyaların içinden bir yineleme vardır: Ben bunların her biri (örnek kod okuduktan sonra bariz olay olan) ayrı istek olarak bana geliyor birden fazla dosya yüklerken şey vardır.

Şimdi birden çok dosyayı tek, tek bir istek olarak yüklemek mümkün olup olmadığını merak ediyorum. kontrolör tarafı istemci tarafındaki yükleme hizmeti

@RequestMapping(value = "/upload", method = RequestMethod.POST) 
    public String save(@ModelAttribute("filesForm") FileUploadForm filesForm) { 
       List<MultipartFile> files = filesForm.getFiles(); 
       //do something 

     } 


public class FileUploadForm 
    { 
    private List<MultipartFile> files; 

    // geters and setters ... 

    } 

oluşturmak yaya

Answer 1

return { 
      send: function(files) { 
       var data = new FormData(), 
      xhr = new XMLHttpRequest(); 
       xhr.onloadstart = function() { 
        console.log('Factory: upload started: ', file.name); 
        $rootScope.$emit('upload:loadstart', xhr); 
       }; 

       xhr.onerror = function(e) { 
        $rootScope.$emit('upload:error', e); 
       }; 
       xhr.onreadystatechange = function(e) 
       { 
        if (xhr.readyState === 4 && xhr.status === 201) 
        { 
         $rootScope.$emit('upload:succes',e, xhr, file.name ,file.type); 

        } 
       }; 

     angular.forEach(files, function(f) { 
     data.append('files', f, f.name); 
      }); 

       xhr.open('POST', '../upload'); 
       xhr.send(data); 


      } 
     };