目录
同样是百度无法给出更好的解决方案，所以索性自己拼凑一下，使用angular 提交form 表单时，允许上传多个文件，后台为 spring springMVC mybatis
前端html
<input type="text" ng-model="param.empCode" placeholder="请输入员工工号" ><input id="fileUpload" name="files" multiple="multiple" type="file" /> <button class="btn btnImg pubBtn" type="submit" ng-click="submitForm()" >
一个员工工号，一个file，一个确认按钮，
js脚本
$scope.submitForm = function() {var form = new FormData();var files = document.querySelector('input[name="files"]').files;for (var i=0; i<files.length; i++) {form.append("file", files[i]);}var user =JSON.stringify($scope.param);form.append('user',user); file_action.uploadfile("/eHR/chargebackInformation/infoAdd",form,function (data){if(data.code>0){toaster.pop("success", "", "成功!");}else{toaster.pop("fail", "", "提交失败，请检查参数!");}}); };
ps: 其中form 为传输过去的整个表单，对于多个文件，需要使用append将所有的文件全部加入到form中，
file_action是我自己封装的一个上传的组件，
底层如下
(function (angular) {'use strict';angular.module('app').factory("file_action", function ($rootScope, common_base, $http) {var service = { uploadfile: function (url,data, callback) { if (common_base.is_function(data)) { callback = data; data = undefined; } $http({ method: 'POST', url: $rootScope.app.getway + url, data: data, headers: {'Content-Type':undefined}, transformRequest: angular.identity }).success(function (data, header, config, status) { callback(data); }).error(function (data, header, config, status) { alert("文件上传调用接口失败，请联系管理员"); }); } };return service;})})(window.angular);
后台接受
@RequestMapping(value = "/infoAdd",method = RequestMethod.POST)public ResponseMessage chargebackAdd(@RequestParam(value = "file", required = false) MultipartFile[] files,@RequestParam(value = "user", required = false)String user,HttpServletRequest request) throws Exception{//拿到这个表单其他的元素的值，使用jackson转化我model ObjectMapper objectMapper = new ObjectMapper(); objectMapper.configure(DeserializationFeature.FAIL_ON_UNKNOWN_PROPERTIES,false);ChargebackInformationBean chargebackInformationBean = objectMapper.readValue(user, ChargebackInformationBean.class);//将文件保存if(files!=null&&files.length>0){for(int i=0;i<files.length;i++){FILEUtil.saveUploadFile(files[i],request,id);}} }
文件工具类进行保存
public static String saveUploadFile(MultipartFile file, HttpServletRequest request,Long id ) throws Exception {String newFileName ="";FileOutputStream fos =null;InputStream in=null;try {// 获得原始文件名String fileName = file.getOriginalFilename();// 新文件名newFileName =fileName;// 获得项目的路径ServletContext sc = request.getSession().getServletContext();// 上传位置 图片 String path = sc.getRealPath("/upload/")+id.toString()+"/"; // 设定文件保存的目录File f = new File(path);if (!f.exists())f.mkdirs();if (!file.isEmpty()) {fos = new FileOutputStream(path + newFileName);in = file.getInputStream();int b = 0;while ((b = in.read()) != -1) {fos.write(b);}fos.close();in.close();}}catch (Exception e){LOGGER.info("上传的文件保存出错",e);throw new BusinessException(MessageCode.EXCEPTION_FILE_HANDLE.getValue(),MessageCode.EXCEPTION_FILE_HANDLE.getType());}finally {if(fos!=null){fos.close();}if(in!=null){in.close();}}return newFileName;}
