效果展示
前言
- app有许多页面需要添加图片并实现预览功能.所以有必要封装一个公共的组件去调用
- 由于代码比较多.不便贴出来.所以这里介绍一下大致结构.自己去github上看完整代码.
简书上贴出的代码都有可能改动,请以github上为准
准备
- 插件准备
camera插--拍照获得照片
Image Picker--用于从相册多选照片
- 认识Swiper3--用于实现图片预览
- ionic版本最低为3.0
核心代码
-
select-pic.ts单击图片放大看红色标注
-
viewer-pic.ts
使用
-
如果你的app也分了多个Module,在使用前需要把导入Module.
-
调用组件
最后
angular自定义组件就是学会使用@input()和@output().本文也演示了自定义双向数据绑定的方法
@Input() name;
@Output() nameChange;
