本文介绍如何在ionic项目中使用设备的camera。

Ionic版本:v3.2.0 / 2017-05-10 / MIT Licensed / Release Notes

=============================================================================

1)第一步是安装ionic-native/core。所有用到Native的功能,这一步不能省。npm install @ionic-native/core --save

ps:关于第一步,官方的说明是ionic-native/core是默认就包含在每一个Ionic应用里面的,注意下图中的红色矩形文字。

言外之意如果开发环境都是最新版本,期间也没有经历Ionic版本的升级,是可以忽略这一步的,不需要开发者手动安装。

但是,在实际开发过程中,很多时候可能会遇到下面这样的问题:

原因无非还是因为升级。。。升级。。。升级。我的项目创建是基于Ionic v2.2.2版本。但是期间经历过Ionic官方升级到v3.2.0版本。

所以解决的办法就是:

2)其次是给自己的项目添加cordova插件。ionic cordova plugin add cordova-plugin-camera

3)安装相应的node_moudles。npm install --save @ionic-native/camera

4)找到代码src->app下的app.moudle.ts文件, Add this plugin to your app's module。这一步可以放到最后做,但是一定不要忘。

5)其他就是添加你如何使用Camera的代码。

6)编码工作完成后,就是使用Chrome测试cordova插件了。

ionic cordova platform add browser

ionic cordova run browser

 不是直接ionic serve的原因参见:http://www.cnblogs.com/crazyprogrammer/p/6878981.html
注意Chrome阻止网页使用摄像头的时候,记得修改为允许。

参考:

  Ionic官网:http://ionicframework.com/docs/native/camera/

Ionic项目中如何使用Native Camera的更多相关文章

  1. ionic 项目中使用ngCordova插件$cordovaCamera筛选手机图库图片显示出来并上传

    原文档请看http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/ionic%E5%9B%BE%E7%89%87%E4%B8%8A%E4%B ...

  2. iOS原生项目中集成React Native

    1.本文的前提条件是,电脑上已经安装了CocoaPods,React Native相关环境. 2.使用Xcode新建一个工程.EmbedRNMeituan [图1] 3.使用CocoaPods安装Re ...

  3. Ionic项目中使用极光推送

    Ionic项目中使用极光推送-android   对于Ionic项目中使用消息推送服务,Ionic官方提供了ngCordova项目,这个里面的提供了用angularjs封装好的消息推送服务(官方文档) ...

  4. Ionic项目中使用极光推送-android

    对于Ionic项目中使用消息推送服务,Ionic官方提供了ngCordova项目,这个里面的提供了用angularjs封装好的消息推送服务(官方文档),使用的是GitHub上的 PushPlugin ...

  5. ionic 项目中 使用 sass

    注: 1.先安装node-sass  -->> npm install --save node-sass --registry=https://registry.npm.taobao.or ...

  6. ionic 项目中添加modal的步骤流程

    1.首先在templates文件夹下面定义一个新页面,xxx.html,template文件夹在空项目里面是没有的,需要手动添加一个,放在WWW文件夹下面. <ion-modal-view> ...

  7. ionic项目中手机状态栏显示使用$cordovaStatusbar插件

    在项目中发现Android和iOS在手机状态栏样式不一样,然后就查到有一个cordova插件可以解决这个问题 1.下载插件$cordovaStatusbar命令: cordova plugin add ...

  8. ionic 项目中创建侧边栏的具体流程分4步简单学会

    这是在学习ionic时,当时遇到的一些问题,觉得很难,就记笔记下来了,现在觉得如果可以拿来分享,有可能会帮助到遇到同样问题的人 ionic slidemenu 项目流程: cd pretices(自己 ...

  9. 总结angular+ionic项目中的问题

    1:tab的路由导向问题 运用ion-tabs时,第一个ion-tabs标签下的href功能会覆盖掉路由中定义的默认路由(进入应用后直接加载href指向的组件). 解决方法:多写一个ion-tabs标 ...

随机推荐

  1. Microsoft Sql Server 2016安装在CentOS7下

    安装过程 如何安装直接参考这个文章:安装sql server 整个安装过程非常简单. 上面的文档里是通过 sudo 命令,用root身份来执行,不过这里为了简单,就用root账号来安装的. (1)下载 ...

  2. 纸壳CMS替换默认实现

    简介 纸壳CMS是一个开源免费的可视化内容管理建站系统,拖拽就可以轻松建网站. GitHub: http://github.com/SeriaWei/ZKEACMS 纸壳CMS在设计上使用的是ASP. ...

  3. linux 下mysql/php编译配置参数

    mysql cmake 编译参数 cmake -DCMAKE_INSTALL_PREFIX=/opt/mysql \-DSYSCONFDIR=/opt/mysql/etc \-DMYSQL_DATAD ...

  4. windows下redis安装及应用

    一.下载安装Redis(windows版本) 1.下载地址:https://github.com/MicrosoftArchive/redis/releases 2.安装: 1)打开运行窗口,输出cm ...

  5. 标准 OpenStack 多region配置

    首先搭建两套一样的OpenStack环境 更改前: node1: 192.168.200.100 RegionOne node2: 192.168.200.200 RegionOne 预期结果: no ...

  6. jQuery ajax的jsonp跨域请求

    一直在听“跨域跨域”,但是什么是跨域呢?今天做了一些了解.(利用jQuery的jsonp) jQuery使用JSONP跨域 JSONP跨域是利用script脚本允许引用不同域下的js实现的,将回调方法 ...

  7. rawt

    这里写自定义目录标题 欢迎使用Markdown编辑器 新的改变 功能快捷键 合理的创建标题,有助于目录的生成 如何改变文本的样式 插入链接与图片 如何插入一段漂亮的代码片 生成一个适合你的列表 创建一 ...

  8. 六,mysql优化——小知识点

    1,选择适当的字段类型,特别是主键 选择字段的一般原则是保小不保大,能占用字节小的字段就不用大字段.比如主键,建议使用自增类型,这样节省空间,空间就是效率!按4个字节和按32个字节定位一条记录,谁快谁 ...

  9. D03——C语言基础学习PYTHON

    C语言基础学习PYTHON——基础学习D03 20180804内容纲要: 1 函数的基本概念 2 函数的参数 3 函数的全局变量与局部变量 4 函数的返回值 5 递归函数 6 高阶函数 7 匿名函数 ...

  10. 微信小程序云函数 添加数据到数据库

    1.新建小程序,建立云开发快速启动模板 这里和普通小程序的区别有三点 一是 project.config.json写上云函数所在目录"cloudfunctionRoot": &qu ...