Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/java/403.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

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/jpa/2.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
Java 使用angularjs和Spring mvc上传数据和多个文件_Java_Angularjs_Spring_Angularjs Fileupload - Fatal编程技术网

Java 使用angularjs和Spring mvc上传数据和多个文件

Java 使用angularjs和Spring mvc上传数据和多个文件,java,angularjs,spring,angularjs-fileupload,Java,Angularjs,Spring,Angularjs Fileupload,我有一个结构如下的html表单: <form class="form-horizontal" method="post" enctype="multipart/form-data"> <div class="form-group"> <div class="col-sm-10 top-element"> <select class="form-control" ng-model="category" id=

我有一个结构如下的html表单:

<form class="form-horizontal" method="post" enctype="multipart/form-data">
    <div class="form-group">
        <div class="col-sm-10 top-element">
            <select class="form-control" ng-model="category" id="categorySelect" required>
                <option selected value="1">Application & Services</option>
                <option value="2">Benefits & Paper Work</option>
                <option value="3">Hardware & Software</option>
                <option value="4">People Management</option>
                <option value="5">Security & Access</option>
                <option value="6">Workplaces & Facilities</option>
            </select>
        </div>
        <div class="col-sm-10 element">
            <input type="text" ng-model="name" class="form-control" id="ticketName" required>
        </div>
        <div class="col-sm-10 element">
            <textarea class="form-control" ng-model="description" id="ticketDescription" rows="3"></textarea>
        </div>
        <div class="col-sm-10 element">
            <select class="form-control" ng-model="urgency" id="ticketUrgency" name="urgency">
                <option selected value="Low">Low</option>
                <option value="Medium">Medium</option>
                <option value="High">High</option>
                <option value="Critical">Critical</option>
            </select>
        </div>
        <div class="col-sm-10 element">
            <input class="form-control" id="date" name="date" ng-model="date" placeholder="MM/DD/YYYY" type="text"/>
        </div>
        <div class="col-sm-10 element">
            <div class="form-inline">
                <input type="file" class="form-control" id="file" name="file" file-model="file" multiple
                       accept=".pdf,.jpeg,.jpg,.doc,.docx,.png">

                <input type="button" class="form-control" id="deleteFile"
                       onclick="document.getElementById('file').value = ''" value="Delete">
            </div>
        </div>
        <div th:text="${error}"></div>
        <div class="col-sm-10 element">
            <textarea class="form-control" id="comment" ng-model="comment" rows="3"></textarea>
        </div>
    </div>

    <div class="form-inline" style="float: right; margin-bottom: 60px; margin-right: 60px;">
        <input type="submit" ng-click="saveDraft()" name="draft" class="btn btn-primary ticket-list-btn draft-btn"
               value="Save as Draft">
    </div>

</form>
和弹簧控制器:

        var data = {
                name: $scope.name,
                description: $scope.description,
                desiredResolutionDate: $scope.desiredResolutionDate,
                state: $scope.ticketState,
                categoryId: $scope.category,
                urgency: $scope.urgency,
                comment: $scope.comment
            }
        ;
        $http.post(url, data)
            .then(
                function (response) {
                },
                function (errResponse) {
                    console.log(errResponse);
                }
            )
@RequestMapping(value = "/new", method = RequestMethod.POST)
public void createTicket(@RequestBody TicketDto newTicketDto, Authentication authentication) {
    User user = userService.loadUserByUsername(authentication.getName());
    newTicketDto.setOwnerId(user.getId());
    Ticket ticket = TicketDto.transformToEntity(newTicketDto);
    ticketService.save(ticket);
}
我试图添加到我的TicketDto对象字段
MultipartFile[]文件并像其他字段一样在post请求中发送文件,但它不起作用。如何执行此操作?

角度零件代码 java部件 文件模型
谢谢,但它只适用于一个文件。如何处理多个文件上载?我试图使用
@RequestParam MultipartFile[]files
,但当我上传文件时,数组的长度是0。这在使angularjs code
var file=$scope.file时太简单了自身附加您的文件
fd.append('file',file)
我认为您使用的是
file model=file
指令,因为它将返回0索引将其更改为返回文件数组中的所有元素您可以发布您的文件模型指令吗?@Fairy我已经用文件模型更新了我的答案它将只对一个文件输入多个文件有效接受的答案对多个文件无效文件夹。
var file = $scope.file;
var fd = new FormData();
fd.append('dto', JSON.stringify($scope.ticketdto));
fd.append('file', file);

$http({
        method : 'POST',
        url : 'url',
        headers : {
            'Content-Type' : undefined
        },
        data : fd,
        transformRequest : function(data, headersGetterFunction) {
            return data;
        }
    }).then(function(response) {
        ......
    }).catch(function(response) {           
        ......
    });
   @RequestMapping(value = "/new", method = RequestMethod.POST)
   public void createTicket(@RequestParam String dto,
        @RequestParam(required = false) MultipartFile file , Authentication authentication) {
        ....
           //convert string ticket to dto using jackson databind
        .....
   }
 yourappname.directive('fileModel', ['$parse', function ($parse) {
return {
    restrict: 'A',
    link: function (scope, element, attrs) {
        var model = $parse(attrs.fileModel);
        var modelSetter = model.assign;

        element.bind('change', function () {
            scope.$apply(function () {
                modelSetter(scope, element[0].files);
            });
        });
    }
  };
 }]);