ng-file-upload文件上传
程序员文章站
2022-06-12 11:08:13
...
前端
后端：
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>文件上传</title>
<meta charset="utf-8" />
<script src="JS/angular.min.js"></script>
<script src="JS/ng-file-upload.min.js"></script>
<script src="JS/ng-file-upload-shim.min.js"></script>
<script>
var app = angular.module('app', ['ngFileUpload']);
app.controller('bmcuCtrl',
[ '$scope', 'Upload', function($scope, Upload) {
$scope.uploadFile = function() {
Upload.upload({
//服务端接收
url: 'api/customer/uploadBatchFile',
//上传的同时带的参数
data: {},
file: $scope.file
}).progress(function (evt) {
//进度条
var progressPercentage = parseInt(100.0 *
evt.loaded / evt.total);
console.log('progess:'+progressPercentage+
'%' + evt.config.file.name);
}).success(function (data, status, headers, config) {
//上传成功
console.log('file ' + config.file.name
+ 'uploaded. Response: ' + data);
}).error(function (data, status, headers, config) {
//上传失败
console.log('error status: ' + status);
});
}
} ]);
</script>
</head>
<body ng-controller="'bmcuCtrl'">
<div>
<a href="/app/public/common/batch-mode-cust-unit/batch_change.xls" style="color: red;"
target="_blank"> 模板下载 </a>
<input type="file" name="file" ngf-select ng-model="file" accept="application/msexcel" >
<button class="btn btn-primary" ng-click="uploadFile()">导入</button>
</div>
</body>
</html>
后端：
@Controller
@RequestMapping("/api/customer")
@ResponseBody
public class TestNgUpload{
@RequestMapping("/uploadBatchFile'")
public void uploadBatchFile'(HttpServletRequest request) throws Exception {
CommonsMultipartResolver multipartResolver =
new CommonsMultipartResolver(request.getSession().getServletContext());
if(multipartResolver.isMultipart(request)){
//再将request中的数据转化成multipart类型的数据
MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request;
Iterator iter = multiRequest.getFileNames();
while (iter.hasNext()) {
String name = (String) iter.next();
MultipartFile file = multiRequest.getFile(name);
String fileName = file.getOriginalFilename();
String format = fileName.substring(fileName.indexOf(".")+1);
InputStream inputStream = file.getInputStream();
Workbook wb = null;
if (format.equals("xls") || format.equals("msexcel")) {
wb = new HSSFWorkbook(inputStream);
}
if (format.equals("xlsx")) {
wb = new XSSFWorkbook(inputStream);
}
String[][] objArray = ExcelUtil.readExcel(wb, 1);
if(objArray.length>0){
BatchCustUnitVo batchCustUnitVo = new BatchCustUnitVo();
List<String> accNbrList = new ArrayList<String>();
List<String> dataColList = new ArrayList<String>();
for(int i=0;i<objArray.length;i++){
accNbrList.add(objArray[i][0].trim());
dataColList.add(objArray[i][1].trim());
}
batchCustUnitVo.setAccNbrList(accNbrList);
batchCustUnitVo.setDataColList(dataColList);
customerService.uploadBatchCustUnit(batchCustUnitVo);
}
}
}
}}
上一篇： 我常用的common function库
下一篇： Redis数据库系列（一）