在上一篇博客离子本地相册,拍的照,裁剪,上传(单图完全版)中,跟大家分享了离子项目选择本地图片,拍的照,裁剪,上传到服务器的内容,但是上一节的内容由于使用了科尔多瓦的相机插件进行了图片选择与拍摄,所以每次只能支持1张图片的选择与上传。上一篇博客中的内容适合用于头像情景。
在本节中,跟大家分享使用Corodva的image picker插件,实现多图选择与上传。废话不多说,进入主题。
插件安装
科尔多瓦插件添加corodva-plugin-imagepicker
科尔多瓦插件添加cordova-plugin-file-transfer
定义图片选择服务
angular.module(“起动器。服务”,[])//配置单张图片选择
.factory (SelectPicture,函数(还是吐司){
返回{/* *
*从图库选择多张图片
*/choosePictures:函数(){
window.imagePicker.getPictures(函数(res) {
(var=0;我& lt;res.length;我+ +){
还是。还是(res[我],“我的服务器接口地址");//传递自己的服务器接口地址
}
}、功能(err) {
警报(错);
},{
maximumImagesCount: 10,
质量:80
});
}
}
})
定义文件上传服务
//文件上传
.factory('还是',函数(吐司){
返回{/* *
*上传文件到服务器
*
* @param fileUrl文件路径
* @param服务器服务器接口
*/还是:函数(fileUrl、服务器){
document.addEventListener (“deviceready”>
angular.module(“起动器。控制器”,[])
范式(UsedUploadCtrl,函数(范围、SelectPicture) {/* *
*选择图片并上传
*/美元的范围。uploadImage=function () {
SelectPicture.choosePictures(范围);
}
})
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
