1. Issue Overview
Looking to terminate file upload in PrimeNG's FileUpload component when certain filename patterns are detected. Using Angular 6.0.7 and PrimeNG 6.0.2.
2. Initial Strategy
2.1. HTML Code
<p-fileUpload #fileUploader name="file" url="{{uploadUrl}}" accept=".jpeg,jpg"
auto="auto" mode="basic" chooseLabel=„Upload file“
(onBeforeUpload)="fileUploadOnBeforeUpload($event, fileUploader)">
</p-fileUpload>
2.2. TypeScript Implementation
fileUploadOnBeforeUpload(event) {
if (condition) {
event.xhr.abort();
}
}
2.3. Outcome
Method executed without errors, but failed to stop the upload process.
3. Revised Approach
3.1 TypeScript Revision
fileUploadOnBeforeUpload(event, fileUploader: FileUpload) {
if (condition) {
for (let file of fileUploader.files) {
const index = fileUploader.files.indexOf(file);
fileUploader.remove(event, index);
}
}
}
3.2 Result of Update
Selected files successfully removed before transfer, halting the upload process as intended. However, backend server logs a 400 error due to empty request in the browser console:
Failed to load resource: the server responded with a status of 400 ()4. Ongoing Challenge
Seeking solution on how to effectively abort file uploads in PrimeNG FileUpload component after specific file selections.