在angular2中使用cordova相机插件的问题答案

【问题标题】：Issue at using cordova camera plugin within angular2在angular2中使用cordova相机插件的问题
【发布时间】：2023-04-01 22:25:01
【问题描述】：

我尝试让 cordova-plugin-camera 在 angular2 中使用一个简单的测试组件运行。

首先，我通过在cordova 安装插件将插件添加到cordova。接下来，我在 index.html 中添加了 cordova.js。

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

之后我构建了一个简单的角度组件来调用cordova插件。这个组件有一个按钮，这个按钮应该通过cordova调用原生相机。

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

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

通过单击组件上的方法/功能将被调用。我声明了一个cordova变量来访问cordova插件。

角度组件 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);
    });
  }

}

该组件可以正常工作，但是当我按下“图片”按钮时，该函数被调用，但科尔多瓦没有打开本机图片应用程序。调用 cordova.plugins.camera.getPicture(..) 不起作用。有人可以帮忙吗？我错过了什么？提前非常感谢。

【问题讨论】：

标签： javascript android angular cordova cordova-plugins

【解决方案1】：

好吧，我帮自己。我遇到的问题是我使用了错误的变量。

代替

destinationType：cordova.plugins.camera.DestinationType.DATA_URL，

我添加采取以下方式：

destinationType：navigator.camera.DestinationType.DATA_URL，

为此，我必须为它声明一个变量。

声明 let navigator: any;`

非常感谢 `

【讨论】：