ionic 的项目实现从手机相册选取图片或拍照并上传至服务器

宋俊波

于 2016-08-05 16:43:21 发布

阅读量9.7k

点赞数 5

分类专栏：【 AngularJS +ionic 】文章标签： ionic angular 上传图片相册选择图片多文件上传

本文链接：https://blog.youkuaiyun.com/JunBo_Song/article/details/52130579

版权

本文介绍了如何在Ionic项目中结合ng-file-upload插件，实现从手机相册选择图片或拍照，并将图片上传到服务器的功能。首先，通过bower下载ng-file-upload插件，然后在 Ionic 应用中引入该模块。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

【一】使用 bower 下载 ng-file-upload 插件

(bower 是什么以及如何安装与使用在我的博客中有一篇文章介绍，可移步查看)

【二】app 中引入 'ngFileUpload'

        (function(){
            angular.module('starter', [
                'ionic','ngFileUpload'
            ]);
       })();

【三】HTML 文件中

       <ion-item  class="ionItem1" ngf-select ng-model="data.file" name="file" ngf-pattern="'image/*'" ngf-multiple="false">
            <label class="item_title">头像</label>
            <img src="" class="headerImage"  ngf-src="data.file || data.defaultImage">
            <span class="ion-chevron-right"></span>
        </ion-item>

【四】控制器中（控制器需注入