Здесь я предоставил свой код AngularJS с помощью файла HTML, но я новичок в AngularJS и не знаком с API REST в Java.
Цель: я хочу создать код AngularJS дляСохранение файлаКогда я загружаю файл, он должен вызывать API, файл должен быть сохранен в папке на сервере.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body ng-app="demoApp" ng-controller="mainCtrl as vm">
<div class="container">
<div class="row">
<div class="col-md-12">
<blockquote>
Angularjs multple file upload
</blockquote>
</div>
<div class="row">
<form name="fileform">
<div class="form-group">
<label for="fileinput" class="col-sm-3 control-label">Files</label><br>
<div class="col-sm-12">
<input type="file" id="fileinput" name="logos"
file-model="vm.logos" multiple="multiple"
class="form-control" placeholder="Files" />
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<button type="submit" ng-click="vm.create()" class="btn btn-default">Create</button>
</div>
</div>
</form>
</div>
</div>
</div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
<script>
(function(){
angular.module("demoApp",[])
.controller('mainCtrl',function($http){
var vm = this;
vm.create = function(){
var fd = new FormData();
angular.forEach(vm.logos, function (val, key) {
fd.append('file'+key, val);
});
$http.post('http://localhost:8080/' + 'uploads', fd, {
transformRequest: angular.identity
, headers: {
'Content-Type': undefined
}
})
.success(function(serviceResponse) {
console.log(serviceResponse);
})
};
})
.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 () {
var files = [];
angular.forEach(element[0].files,function(file){
files.push(file);
})
scope.$apply(function () {
modelSetter(scope, files);
});
});
};
};
}]);
})();
</script>
</body>
</html>