微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

如何解决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;
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。