带有鼠标事件的 Angular 2/4 图像裁剪
Posted
技术标签:
【中文标题】带有鼠标事件的 Angular 2/4 图像裁剪【英文标题】:Angular 2/4 Image Cropping with mouse event 【发布时间】:2017-07-19 11:39:17 【问题描述】:我是 angular2/4 的新手。我正在寻找可以使用鼠标事件裁剪图像的角度包。我搜索了很多,但可以找到任何东西。希望你们有一个。或者给我一些提示如何实现一个好的。
我发现了一些用于图像裁剪的软件包,但它们对我的情况并不是很有帮助。
谢谢
【问题讨论】:
【参考方案1】:您需要在 purejs 上包含模块。加上为模块添加类型,你可以使用带有接口的模块。
我找了找
-
https://github.com/fengyuanchen/cropperjs
https://www.npmjs.com/package/@types/cropperjs
对于鼠标事件阅读这篇文章 - Angular2: mouse event handling (movement relative to current position)
更新:
你可以使用这个模块https://github.com/cstefanache/angular2-img-cropper
【讨论】:
【参考方案2】:用于单张图片上传和裁剪https://www.npmjs.com/package/ngx-image-cropper 和多个 https://github.com/MMtechnolab/Angular-Typescript--2-8-Multiple-Image-Upload-and-Crop-.git 检查这个 演示:http://mmangimgcrop.gear.host/
我在 Angular 8 中也遇到了同样的问题,所以我对 ngx-image-cropper 进行了一些更改,它允许用户上传多个图像,如下图所示
像这张图片一样,它允许从本地系统中选择多个图片
并通过选择 Image Image Cropper 进行裁剪
【讨论】:
以上是关于带有鼠标事件的 Angular 2/4 图像裁剪的主要内容,如果未能解决你的问题,请参考以下文章
如何在 Angular 2 / 4 中使用鼠标滚轮事件测试指令