angular - Primeng 的 p-fileUpload 中的 onUpload 方法没有运行
我正在我的 HTML 中声明一个文件上传,如下所示
<p-fileUpload name="file" url="http://localhost:8080/integra/services/upload" (onUpload)="onUpload($event)" accept=".txt"></p-fileUpload>
它正在指向我的后端
@PostMapping(value="/upload", produces = MediaType.APPLICATION_JSON_VALUE, consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
public ResponseEntity uploadFile(@RequestParam("file") MultipartFile file) throws IOException {
File convertFile = new File("C:\\upload\\"+file.getOriginalFilename());
convertFile.createNewFile();
FileOutputStream fout = new FileOutputStream(convertFile);
fout.write(file.getBytes());
fout.close();
return new ResponseEntity("OK", HttpStatus.OK);
}
但是当在我的 TypeScript 中执行 onload 事件时,它不起作用……即使放置了 console.log 来测试,也不起作用。这是我的 TypeScript
onUpload(event) {
console.log(event.files.length);
console.log(event.progress);
}
当我运行文件上传时,加载条卡住,无法让我执行另一次文件上传。因此,当加载条永远无法完成时,提到的事件就不会被执行。
最后,文件已保存到指定路径,但我无法正确处理该事件
我将非常感激有人能够帮助我。谢谢
答案#1
我在使用 'onUpload' 方法时也遇到了同样的问题(对我不起作用),你可以改用 uploadHandler 和 customUpload="true",效果非常好!
这里有一些示例代码:
HTML
```
<p-fileUpload #fileInput
name="files"
(uploadHandler)="onUpload($event)"
customUpload="true"
></p-fileUpload>
```
TS
onUpload(event) {
console.log('onUpload', event);
}
