ngx-image-cropper imageloaded() 不将任何图像数据传递给打字稿文件事件方法

问题描述

我正在使用 ngx-image-cropper 加载和裁剪图像。根据文档有

(imageLoaded)="imageLoaded($event)"

但是当我进入打字稿调试方法“imageLoaded()”时，图像未定义！ 它没有向方法传递任何东西。

在图书馆的代码中看到这个

imageLoaded: EventEmitter<void>;

所以看起来事件没有通过任何东西，即使文档说它确实通过了。就我如何访问加载的图像而言，我在这里遗漏了什么吗？

问题 - 文档没有显示在 html 中传递的任何内容，我应该传递 '$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>

解决方法

没错！为了在方法中包含事件，您需要从 html 参数中传递 '$event'

,

您确实需要将 $event 传递给将被调用的函数，尽管文档目前没有显示：

(imageLoaded)="imageLoaded($event)"

然后在被调用的函数中，你可以获得这样的数据（参考LoadedImage的文档）：

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