java - angularjs spring Rest文件上传表单

Question

我通过以下代码进行了 AngularJS Spring Rest 文件上传，它运行良好并保存文件，现在我想通过文件上传向 html 表单添加一些输入文本(如描述)并保存它们，我应该在 Angular Controller 中的 formData() 中添加什么代码来实现此操作？

AngularJS Controller

var myDropzone = new Dropzone("div#file", 
                { url: "#"
                });
            myDropzone.on("addedfile", function(file) {
                 $scope.file=file; 

            });
     $scope.uploadFile=function(){
        var formData=new FormData();
        formData.append("file",$scope.file);
        console.log(formData)
        $http.post('/pagingpoc/app/newDocument', formData, {
            transformRequest: function(data, headersGetterFunction) {
                return data;
            },
            headers: { 'Content-Type': undefined }
            }).success(function(data, status) {                       
                console.log("Success ... " + status);
            }).error(function(data, status) {
                console.log("Error ... " + status);
            });
        $('#saveAttachmentModal').modal('hide');
  };

html 表单

  <form ng-submit="uploadFile()"  enctype="multipart/form-data">

        <div class="form-group">
          <label>Description</label>
          <textarea rows="5" cols="5" ng-model="description"></textarea><br>
        </div>

        <div  id="file" class="dropzone"></div>
        <div class="modal-footer">
         <button type="button" class="btn btn-default" 
                   data-dismiss="modal" ng-click="clear()">
              <span class="glyphicon glyphicon-ban-circle"></span> Cancel
                        </button>
          <button type="submit"  class="btn btn-primary">
                      <span class="glyphicon glyphicon-save"></span> Save
                        </button>
        </div> 
     </form>

休息 Controller

      public void UploadFile(MultipartHttpServletRequest request,
                HttpServletResponse response) throws IOException {

        Attachment attachment=new Attachment();
        Iterator<String> itr=request.getFileNames();
        MultipartFile file=request.getFile(itr.next());
        String fileName=file.getOriginalFilename();
        attachment.setName(fileName);
        attachmentRepository.save(attachment);
        File dir = new File("/home/ali/");
         if (dir.isDirectory())
         {
            File serverFile = new File(dir,fileName);
           BufferedOutputStream stream = new BufferedOutputStream(
                 new FileOutputStream(serverFile));
           stream.write(file.getBytes());
           stream.close();
       }else {
        System.out.println("Error Found");
      }

 }

Answer 1

Controller :

var myDropzone = new Dropzone("div#file", { url: "#"});
myDropzone.on("addedfile", function(file) {
    $scope.file=file; 
});
$scope.text = '';
$scope.uploadFile = function(){
    var formData=new FormData();
    formData.append("file",$scope.file);
    formData.append("text",$scope.text); //here
    $http.post('/pagingpoc/app/newDocument', formData, {
            transformRequest: function(data, headersGetterFunction) {
                return data;
            },
            headers: { 'Content-Type': undefined }
            }).success(function(data, status) {                       
                console.log("Success ... " + status);
            }).error(function(data, status) {
                console.log("Error ... " + status);
            });
        $('#saveAttachmentModal').modal('hide');
  };

hmlt:

描述
取消 节省