TypeError: не может прочитать свойства не определенных в угловом применении JS ⇐ Javascript

[Anonymous]

Я создал Angular JS -приложение, в основном я пытаюсь загрузить файл. Страница дает возможность выбрать CSV. Тогда есть кнопка загрузки. После нажатия он вызовет функцию Java и загрузите файл. Однако я получаю ошибку. Mypage.xhtml выглядит так, где я добавил весь код. < /P>



CSV Upload








Upload CSV File

Upload


// app.js
var app = angular.module('csvApp', []);

app.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[0]);
});
});
}
};
}]);

app.service('fileUpload', ['$http', function ($http) {
this.uploadFileToUrl = function(file, uploadUrl){
var fd = new FormData();
fd.append('file', file);
console.log("inside service");
$http.post(uploadUrl, fd, {
transformRequest: angular.identity,
headers: { 'Content-Type': undefined }
})
.then(function(response){
console.log("File uploaded successfully");
}, function(error){
console.log("Error uploading file");
});
}
}]);

app.controller('CsvController', ['$scope', 'fileUpload', function($scope,$http, fileUpload){
$scope.uploadFile = function(){
var file = $scope.myFile;
console.log('file is ' );
console.dir(file);
var REST_BASE_URL = PluginHelper.getPluginRestUrl("apponboarding");
console.log('BASE URL is ' );
console.log(REST_BASE_URL);
var uploadUrl = REST_BASE_URL+ "/upload";
console.log('uploadUrl URL is ' );
console.log(uploadUrl);
console.log(fileUpload);
fileUpload.uploadFileToUrl(file, uploadUrl);
console.log("Controller END");
};
}]);



< /code>
Но когда я нажимаю на загрузку, я получаю ошибку, < /p>
TypeError: Cannot read properties of undefined (reading 'uploadFileToUrl')
at $scope.uploadFile (pluginPage.jsf?pn=apponboarding20)
at fn (eval at compile (angular.min.js:239:266), :4:150)
at e (angular.min.js:284:187)
at b.$eval (angular.min.js:148:347)
at b.$apply (angular.min.js:149:52)
at HTMLButtonElement. (angular.min.js:284:239)
at HTMLButtonElement.dispatch (jquery.min.js:3:10316)
at q.handle (jquery.min.js:3:8343)
< /code>
Файл должен быть загружен с помощью кода Java ниже < /p>
@PostMapping("/upload")
public ResponseEntity handleFileUpload(@RequestParam("file") MultipartFile file) {
if (file.isEmpty()) {
log.error("New Function- Empty File Detected-");
return new ResponseEntity("No file uploaded.", HttpStatus.BAD_REQUEST);
}

try {
// Save the file to the server
log.error("New Function- File Detected-");
String uploadDir = "uploads/";
File uploadFile = new File(uploadDir + file.getOriginalFilename());
file.transferTo(uploadFile);

return new ResponseEntity("File uploaded successfully.", HttpStatus.OK);
} catch (IOException e) {
return new ResponseEntity("Error uploading file.", HttpStatus.INTERNAL_SERVER_ERROR);
}


Подробнее здесь: https://stackoverflow.com/questions/794 ... pplication