0.0.1 • Published 4 years ago
@jzhsoft/img-preview v0.0.1
图片预览 m2-img-preview
支持在pc端与移动端的图片全屏查看功能； 拥有缩放、旋转、反转、删除、幻灯片功能； 并可扩展自定义按钮及事件；
安装与部署
版本对应支持
| 发布版本 | 说明 | 终端 |
|---|---|---|
0.0.1 | angular 8-10 | pc、移动端 |
其他 | angular 6、7 | pc、移动端 |
0.0.1
1. 通过npm 安装插件包
npm i @jzhsoft/img-preview2. 将插件模块引入业务module
import {ImgPreviewModule} from "@jzhsoft/img-preview";
@NgModule({
imports: [
ImgPreviewModule
],
})其他（手动部署）
1. 拷贝插件代码
找到指定文件夹并拷贝所有文件，源文件夹：
本工程/projects/jzhsoft/img-preview/src/lib/*.*目标文件夹：各自项目/src/app/df-ext/modules/img-preview;
2. 将插件模块引入业务module
注意次相对路径要根据业务模块的所在位置进行修改；
import {ImgPreviewModule} from "../../../df-ext/modules/img-preview";
@NgModule({
imports: [
ImgPreviewModule
],
})API
config
| 参数 | 说明 | 类型(默认值) | |
|---|---|---|---|
imgList | 设置 要预览的图片列表 | array | |
--src | 设置 img src属性 | string | |
--title | 设置 预览时展示的图片名 | string | |
options | 设置 Viewer.js的options项 详情见更多配置：https://github.com/fengyuanchen/viewerjs#options | object | |
--toolbar | 设置 工具栏展示的按钮 | any | |
--delete | 设置 删除按钮是否显示；属性设置 boolean 开启本地删除功能；属性设置 function (必须返回Promise)开始远程删除模式 | boolean | function |
版本说明
发布计划
发布时间 暂无
Features
- 优化删除、下载图标大小
发布历史
0.0.1
2020-07-17
Features
- 图片预览主功能；
- 删除图片 支持本地删除与远程http请求删除；
FAQ
删除图片后如何获取 图片列表的数据？
进行图片删除操作后，控件会更新config配置的imgList属性；按照通用范例的写法 this.imgPreviewConfig.imgList 为操作删除后的图片列表；
0.0.1
4 years ago