Currently, I am facing an issue with my image upload functionality. My goal is to retrieve the width and height of each image before uploading them. However, I've encountered a problem where my function only provides the dimensions for the first image. Below is the snippet of my code:
async getWidthAndHeight(files: any) {
const newPromise = [files].map((file: any, i: any) => {
return new Promise((resolve, reject) => {
var reader = new FileReader();
reader.readAsDataURL(file[i]);
reader.onload = async (e: any) => {
var image = new Image();
image.src = e.target.result;
image.onload = async () => {
this.imageWidth = image.width;
this.imageHeight = image.height;
this.sizeObj = {
width: this.imageWidth,
height: this.imageHeight
};
resolve(this.sizeObj)
}
}
})
})
const final = await Promise.all(newPromise);
return final
}
As a result, the function only retrieves the dimensions of the initial image in the array. My objective is to have the function provide the dimensions for all images. I would appreciate any assistance or suggestions on how to achieve this. Thank you!