1.添加插件

1.1 安装ngcordova

1.2 安装选择图片插件

1.3 安装上传插件

1.4查看安装插件集合

2.html 代码

<div class="item  item-icon-right">
<span>封面图片</span>
<i class="icon ion-images royal" data-tap-disabled="true" ng-click="taskFMpicker()"></i>
</div>
<div class="item item-body" >
<img class="full-image" ng-src="{{FMimage}}" />
</div>
<div class="item item-icon-right">
<span>图片相册</span>
<i class="icon ion-images royal" data-tap-disabled="true" ng-click="taskXCpicker()"></i>
</div>
<div class="row row-wrap item-calm" >
<div class="col col-50" ng-repeat="(k,v) in images"><img ng-src="{{v.imgurl}}" style="width:120px;height:120px; "/>
<p><button type="button" class="button button-small button-outline button-positive " ng-click="delimgs(v.imgurl)">删除</button></p></div>
<div >
</div>
</div>

3.controller 代码

     //封面选择
$scope.taskFMpicker= function () {
var options = {
maximumImagesCount: 1,
width: 600,
height: 600,
quality: 80
};
$cordovaImagePicker.getPictures(options).then(function(results) {
var uri = results[0],
name = uri;
if (name.indexOf('/')) {
var i = name.lastIndexOf('/');
name = name.substring(i + 1);
}
$scope.FMimage = uri; $scope.uploadimage(uri,0);
}, function(error) {
alert(error);
});
}
//选择相册
$scope.taskXCpicker= function () {
var options = {
maximumImagesCount: 5,
width: 600,
height: 600,
quality: 80
};
$cordovaImagePicker.getPictures(options)
.then(function (results) {
for (var i = 0; i < results.length; i++) {
// console.log('Image URI: ' + results[i]);
$scope.images.push({"imgurl":results[i],id:0});
$scope.uploadimage(results[i],1) ;
}
}, function(error) {
// error getting photos
});
}
//上传图片
$scope.uploadimage = function(uri,type) {
var fileURL = uri;
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = fileURL.substr(fileURL.lastIndexOf('/') + 1);
options.mimeType = "image/jpeg";
var server=encodeURI(ENV.APIUrl+"/Upload/ImgUpload");
var ft = new FileTransfer(); $ionicLoading.show({
template: '上传中...'
}); ft.upload(fileURL, server,
function(data) {
// alert(JSON.stringify(data));
var resp = JSON.parse(data.response);
if(resp[0].status==1){
if(type==0){
$scope.FMImgeList.push(resp[0].filename);
//alert($scope.FMImgeList.join(','));
}
else{
$scope.XCImgeList.push("0"+"|"+resp[0].filename);
}
}
$ionicLoading.hide();
},
function(error) {
// alert(JSON.stringify(error));
$ionicLoading.hide();
}, options);
}

最新文章

  1. HDU 1556 线段树或树状数组,插段求点
  2. Linux:添加永久路由
  3. [HDU 5113] Black And White (dfs+剪枝)
  4. 绘制dot 图
  5. angular js 表单验证
  6. [zoj 3774]Power of Fibonacci 数论(二次剩余 拓展欧几里得 等比数列求和)
  7. webpack 理解
  8. SQL Server中varchar和nvarchar的区别
  9. 搭建 springboot 2.0 mybatis 读写分离 配置区分不同环境
  10. ffdshow 源代码分析 9: 编解码器有关类的总结
  11. Spring Boot的Listener机制的用法和实现原理详解
  12. 函数式编程之 Python
  13. fatal error C1859 意外的预编译头错误,只需重新运行编译器(转)
  14. LightOJ 1151 Snakes and Ladders(概率DP + 高斯消元)
  15. linux命令学习之:ls
  16. laravel框架一次请求的生命周期
  17. Oracle EBS R12 客户表结构
  18. 跟踪分析Linux内核的启动过程--20135334赵阳林
  19. bzoj千题计划142:bzoj3144: [Hnoi2013]切糕
  20. mysql-elastic search canal

热门文章

  1. luogu P1332 血色先锋队[bfs]
  2. 尚学python课程---12、python语言介绍
  3. SpringCloud学习笔记(八):Zuul路由网关
  4. 转:C语言中volatile关键字的作用 专家博客
  5. dashboard服务
  6. &lt;小知识&gt;记录
  7. 关于priority_queue和sort()对结构体数组的排序
  8. C# EF去除重复列DistinctBy
  9. neo4j算法(1)-介绍
  10. C# IP正则表达式