在danialfarid angular-file-upload中请求不同的文件

Question

我使用danialfarid angular-file-upload来上传文件。 我想发送带有两个文件和一个json字符串的请求。 服务器端的每两个文件都有不同的参数。 服务器端使用弹簧支架。 我怎么发送？

这是我的角度服务。

services.factory('USR008Service', function($resource, $http, $upload) {
    return {
        insertUSR008FUN01 : function(talent, talentFile, coverImg) {
            return $upload.upload({
                url: contextRoot + '/insertUSR008FUN01',
                fields: {
                    'USR008REQ02': JSON.stringify(talent),
                },
                file: coverImg,
                fileFormDataName : 'coverImg'
            });
        }
    }   
});

这是我的服务器端控制器。

@RequestMapping(value = URIConstant.insertUSR008FUN01, method = RequestMethod.POST, produces = "application/json; charset=utf-8")
public @ResponseBody USR008RES02 insertUSR008FUN01(@RequestParam(value = "talentFile", required = false) MultipartFile talentFile, @RequestParam(value = "USR008REQ02") String jsonData,
        @RequestParam(value = "coverImg", required = false) MultipartFile coverImg) {
    USR008RES02 result = null;
    try {
        Gson gson = new GsonBuilder().create();
        USR008REQ02 usr008req02 = gson.fromJson(jsonData, USR008REQ02.class);
        result = usr008SEV.insertUSR008RES02(usr008req02, talentFile, coverImg);
    } catch (SystemException e) {
        logger.error("insertUSR008FUN01 function has been failed.");
        throw new SystemException("insertUSR008FUN01 function has been failed.", e);
    }
    return result;
}

Answer 1

这是我在我的应用中实现此功能的方法。

<强> HTML

        <label for="uploadDomainFile">Select File</label>
        <input type="file" class="form-control" id="uploadDomainFile" ng-model="fileDomain" ng-file-select>
        <label for="uploadLegalFile">Select File</label>
        <input type="file" id="uploadLegalFile" ng-model="fileLegal" ng-file-select>

<强> JS

//controller
$scope.createDomain = function () {
            adminService.createDomain($scope.domain, $scope.fileLegal, $scope.fileDomain);
        };
//service
//ommitting irrelevant code
uploadOwlFile(fileLegal, domain.id);
uploadOwlFile(fileDomain, domain.id);

        var uploadOwlFile = function(file, domainId) {
          if (file && !!file.value) {
            $upload.upload({
              url: '/api/space/' + domainId + '/owl',
              data: { fileType: file.fileType },
              file: file.value[0]
            })
            .progress(function(evt){
              console.log('progress: ' + parseInt(100 * evt.loaded / evt.total))
            })
            .success(function(data, status, headers, config){
              console.log('success', 'file: ' + config.file.name + ' successfully uploaded');
              return true;
            })
            .error(function(err, status){
              console.log('failure', err);
              return false;
            })
          } else {
            return true;
          }
        };

返回true或false取决于文件上传的状态。

因此，我的方法涉及对2个输入使用两个ng-model并单独上传文件。