I'm using p-fileUpload
in Angular 6.0.0
app, for uploading the image files (In this case multiple images files). It has an event handler (uploadHandler)
for the uploaded files.
<p-fileUpload multiple="true" name="myfile[]" accept="image/*" [auto]="true"
customUpload="true" chooseLabel="Select" (uploadHandler)="uploadImage($event)">
</p-fileUpload>
The files are getting uploaded correctly, but I'm not able to generate the base64 code when looping over the e.files
array, because reader.onloadend
is not firing. I've searched this firing issue and found some related questions but the solution of them is not solving my problem. Below is the code I've written for multiple image file upload -
uploadImage(e: any) {
if (e && e.files.length) {
const reader: FileReader = new FileReader();
e.files.forEach((i: File, j: any) => {
reader.onloadend = (ev: any) => {
console.log('inside??');
// Console is not triggered
};
// reader.readAsDataURL(...);
this.cdr.markForCheck(); // For outside zone detection
});
}
}
Please help me with this problem.
I'm using this same code for single image upload (so I don't need forEach
loop there) inside the same app and it is working in all other places unlike in this case.