ngx-image-cropper imageloaded() not passing any image data to typescript file event method

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;
}