如何在Ionic 1项目中集成Cordoba Camera插件

如何在Ionic 1项目中集成Cordoba Camera插件

问题描述:

我正在尝试将相机应用到我的Ionic 1项目。

I'm trying to implement a camera to my Ionic 1 project.

但是我找不到任何可靠的例子来说明如何做到这一点。
我发现:
https://www.thepolyglotdeveloper.com/2014/09/use-android-ios-camera-ionic-framework/

https://github.com/apache/cordova-plugin-camera
和一些旧的Stack Overflow条目。

But I can't find any reliable examples of how to do that. I found: https://www.thepolyglotdeveloper.com/2014/09/use-android-ios-camera-ionic-framework/ and https://github.com/apache/cordova-plugin-camera and some older Stack Overflow entries.

尽管如此,我还没有自己运行。

Still, I haven't got it running myself.

你'重新走上正轨!你找到的是Cordova最受欢迎的相机插件:

You're on the right track already! What you found is the most popular camera plugin for Cordova:

https://github.com/apache/cordova-plugin-camera

这是一个纯粹的Cordova插件,这意味着它是没有以任何方式调整离子。这意味着,您只需将其添加到您的项目中,并在Ionic准备好后立即使用它:

This is a pure Cordova plugin though, meaning that it's not adjusted in any way for Ionic. This means, you just add it to your project and can use it as soon as Ionic is ready:

ionic.Platform.ready( function() {
  navigator.camera.getPicture(onSuccess, onFail, options);
});

但将回调作为params传递确实不是一种有角度的方式。因此,基本的Cordova相机插件的顶部,您可以添加ngCordova来增强处理。

But passing callbacks as params is indeed not the angular way to do this. So on top of the basic Cordova camera plugin you can add ngCordova to enhance the handling.

要安装和添加ngCordova到您的项目,请按照这些说明:

To install and add ngCordova to your project follow these instructions:

http://ngcordova.com/ docs / install /

包装起来:


  1. 通过bower安装ngCordova

  2. 添加对index.html的js引用

  3. 将ngCordova模块作为依赖项添加到app.js

  4. 如果您已正确添加所有内容,请在您的控制器,指令或服务中注入$ cordovaCamera以使用它。

  1. Install ngCordova via bower
  2. Add js reference to your index.html
  3. Add the ngCordova module as a dependency to your app.js
  4. In case you've added everything correctly, inject $cordovaCamera in your controller, directive or service to use it.

这使您可以以角度方式访问相机,您可以在此处找到更多信息:

This allows you to access the camera the angular way, more about it you can find here:

http://ngcordova.com/docs/plugins/camera/

/**
 * taken from the docs linked above
 * you can now make use of promises here!
 */
$cordovaCamera.getPicture(options).then(function(imageData) {
  var image = document.getElementById('myImage');
  image.src = "data:image/jpeg;base64," + imageData;
}, function(err) {
  // error
});

希望这有助于在您的项目中成功集成相机。 ;)

Hope this helps integrating the camera successfully in your project. ;)