it-swarm-eu.dev

Ionic/Cordova: Jak integrovat Cordova Pluginy do stávajícího Ionic projektu?

Mám Ionic projekt, kde potřebuji plugin Cordova Camera (který jsem nyní úspěšně nainstaloval). Ale v mém projektu ještě není k dispozici API API, to znamená, že jsem dostal chybu:

ReferenceError: Camera is not defined
at Scope.$scope.takePic 

Jak mohu aktivovat rozhraní API rozhraní, které mají být použity v projektu Ionic? Dokumentace o tom se zdá být spíše neexistující nebo velmi dobře skrytá.

14
BadmintonCat

Následuj tyto kroky:

1. Zahrnout ngCordova před cordova.js

Stejný popis najdete v dokumentech .

<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>

2. Přidejte svůj plugin na příkazový řádek

Tento krok můžete najít v dokumentech v sekci vašeho konkrétního pluginu .

ionic plugin add org.Apache.cordova.camera

3. Nezapomeňte, že cordova není k dispozici při práci v prohlížeči

Takže když používáte $cordovaCamera.getPicture, knihovna volá interně navigator.camera.getPicture, která není k dispozici při vývoji v desktopovém prohlížeči. Další čtení

Tým ngCordova/Ionic v současné době pracuje na falešných můžete použít, aby se zabránilo takovým problémům.


Zde si můžete stáhnout ngCordova zde: http://ngcordova.com/docs/install/


Update: Tam je Ionic Native teď, je to jako ngCordova, ale pro ES6 a TypeScript.

27
mrzmyr

Otevřete terminál v kořenovém adresáři aplikace a přidejte plugin přes

cordova plugin add org.Apache.cordova.camera

Upravit :
nový příkaz je: 

cordova plugin rm cordova-plugin-camera //remove
cordova plugin add cordova-plugin-camera //add
6
Clawish

Snažím se zjistit, jak používat standardní Cordova pluginy s Ionic sám, ale iontový tým právě nedávno postavil ngCordova - hranatý obal pro běžné Cordova API, který obsahuje fotoaparát api, který chcete použít. Doporučuje se použít: viz jejich dokumenty pro více informací.

4
premiumFrye

Toto je běžný problém při testování v prohlížeči: http://ngcordova.com/docs/common-issues/

1
Fourat

Plugin můžete nainstalovat spuštěním: 

$ cordova plugin add org.Apache.cordova.camera

Nyní, když máte nainstalovaný plugin, můžete použít API kamery z vašeho Javascriptu:

function takePicture() {
  navigator.camera.getPicture(function(imageURI) {

    // imageURI is the URL of the image that we can use for
    // an <img> element or backgroundImage.

  }, function(err) {

    // Ruh-roh, something bad happened

  }, cameraOptions);
}

Tím bude uživatel vyzván k pořízení fotografie a vrátí místní adresu URL obrázku, který pak můžete použít uvnitř značky nebo použít pro obrázek pozadí CSS.

Níže uvedený kód můžete použít pro jednoduchý obal nad modulem Camera, který usnadňuje asynchronní uchopení fotografií:

module.factory('Camera', ['$q', function($q) {

  return {
    getPicture: function(options) {
      var q = $q.defer();

      navigator.camera.getPicture(function(result) {
        // Do any magic you need
        q.resolve(result);
      }, function(err) {
        q.reject(err);
      }, options);

      return q.promise;
    }   } }]);

Tato továrna může být použita ve vašem regulátoru takto:

.controller('MyCtrl', function($scope, Camera) {

  $scope.getPhoto = function() {
    Camera.getPicture().then(function(imageURI) {
      console.log(imageURI);
    }, function(err) {
      console.err(err);
    });
  };

Který se otevře kamera, když se nazývá getPhoto () (například kliknutím na tlačítko).

V závislosti na tom, jak požadujete data zpět z fotoaparátu a používáte je ve značkách Angular, budete možná muset adresovat adresy URL, takže Angular povolí adresy URL souborů: // (například pokud používáte ng-src pro značku):

module.config(function($compileProvider){
  $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel):/);
})
0
Harkedian

Do regulátoru je třeba vložit Camera:

.controller('MyCtrl', function($scope, Camera) {

Před Camera není znak dolaru. To by mělo být jednoznačněji zdokumentováno.

Do svých služeb budete také muset přidat továrnu.

.factory('Camera', ['$q', function($q) {

  return {
    getPicture: function(options) {
      var q = $q.defer();

      navigator.camera.getPicture(function(result) {
        // Do any magic you need
        q.resolve(result);
      }, function(err) {
        q.reject(err);
      }, options);

      return q.promise;
    }
  }
}])
0
Chad

Přejděte do adresáře projektu.

Spusťte tento příkaz: 

$ ionické integrace umožňují cordova --quiet

(Doufám, že to pomůže ostatním.)

0
RS. Utsha