ngx-image-cropper imageloaded() 未将任何图像数据传递给 typescript 文件事件方法

Question

I'm using ngx-image-cropper to load and crop images. According to the docs there is

(imageLoaded)="imageLoaded($event)"

but when I step into the typescript to debug the method 'imageLoaded()' image is undefined. It's not passing anything to the method.

In the library's code is see this

imageLoaded: EventEmitter<void>;

so it looks like the event doesn't pass anything, even though the docs say it does. Am I missing something here in terms of how I access the loaded image?

QUESTION - The docs don't show anything being passed in the html, should I pass in the '$event'?

 imageLoaded(image: HTMLImageElement) { // image is undefined }

 <image-cropper [imageChangedEvent]="imageChangedEvent" [maintainAspectRatio]="true" [aspectRatio]="4/3" format="png" [transform]="transform" (imageCropped)="imageCropped($event)" (imageLoaded)="imageLoaded($event)" (loadImageFailed)="loadImageFailed()"> </image-cropper>

Answer 1

Exactly! In order to have event inside method you need to pass '$event' from html parameter

Answer 2

You do need to pass $event to the function that will be called, although the docs don't currently show that:

(imageLoaded)="imageLoaded($event)"

Then in the called function, you can obtain data like this (refer to the docs for LoadedImage):

imageLoaded( img: LoadedImage ) {
    const width = img.original.size.width;
    const height = img.original.size.height;
}