简体   繁体   中英

Issue at using cordova camera plugin within angular2

I try to get the cordova-plugin-camera running with a simple test component within angular2.

First I added the plugin to cordova by Installing the plugin at cordova. Following, I added at the index.html the cordova.js.

<body>
  <app-root>Loading...</app-root>
  <script type="text/javascript" src="cordova.js"></script>
</body>

After that I build a simple angular component where to call the cordova plugin. This component has a button and this button should call the native camera via cordova.

Componenten HTML
 <p>
  testcamera works!
</p>

<div>
  <button md-raised-button (click)="takePicture()">Picture</button>
</div>

By clicking the method/function on the component will be called. I declared a cordova variable to have access to the cordova plugins.

Angular component TS

import { Component, OnInit } from '@angular/core';
declare let cordova: any;

@Component({
  selector: 'app-testcamera',
  templateUrl: './testcamera.component.html',
  styleUrls: ['./testcamera.component.css']
})
export class TestcameraComponent implements OnInit {
 public base64Image : String;
 public photos;
 public text;
 constructor() { 
  }

  ngOnInit() {
  }
   takePicture(){
    cordova.plugins.camera.getPicture({
        destinationType: cordova.plugins.camera.DestinationType.DATA_URL,
        targetWidth: 1000,
        targetHeight: 1000
    }).then((imageData) => {
      // imageData is a base64 encoded string
        this.base64Image = "data:image/jpeg;base64," + imageData;
    }, (err) => {
        console.log(err);
    });
  }

}

The component works so fare but when I push the button "Picture" the function get called but the cordova does not open the native picture application. The calling cordova.plugins.camera.getPicture(..) not working. Can anyone help on that? What am I missing? Thanks a lot in advance.

Okay I help myself. The Problem I had was that I was taken the wrong variable.

Instead of

destinationType: cordova.plugins.camera.DestinationType.DATA_URL,

I add to take the follwoing:

destinationType: navigator.camera.DestinationType.DATA_URL,

Also for that I had to declare a variable for it.

declare let navigator: any;`

Thx a lot `

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM