Currently, I am in the process of developing an Angular web application, and one of the functionalities involves photo uploads.
I am looking to add validation for image size to detect if the uploaded image is too small and prompt errors accordingly.
Below is a snippet of my code:
public onImageDrop(evt: any) {
evt.stopPropagation();
evt.preventDefault();
this.croppieImage = null;
this.onCropeMode = true;
const image: HTMLImageElement = new Image();
const file: File = evt.dataTransfer.files[0];
const myReader: FileReader = new FileReader();
myReader.onloadend = ((loadEvent: any) => {
image.src = loadEvent.target.result;
this.croppieImage = myReader.result;
});
myReader.readAsDataURL(file);
**console.log(image.height);
console.log(image.width);**
this.photoInDragMode = false;
this.uplodedPhotoFileName = file.name;
this.uplodedPhotoFileMimeType = file.type;
this.showPhotoSaveButton = true;
this.onCropeMode = true;
}
The issue I'm encountering lies within the lines:
console.log(image.height);
console.log(image.width);
Both outputs always return:
> 0
> 0
If anyone can provide assistance with resolving this matter, it would be greatly appreciated.
Thank you in advance for your help.