Question

我正在开发一款应该用相机拍照的简单应用。相机工作并拍照。但是我无法显示图像。我得到一个空的灰色盒子。在这个框中应该出现图片，但它没有。有人有什么想法吗？

编辑：当我在Android模拟器上运行应用程序时，我可以拍照（内置android功能）并在应用程序中显示。每当我通过Ionic View应用程序或在iOS模拟器中部署它时，我都无法查看图像。

编辑2：我可以在Android设备上运行该应用。我假设Ionic View应用程序有时候有点儿错误。

这是我的代码：

<ion-header>
    <ion-navbar>
        <ion-title>
            Contact
        </ion-title>
    </ion-navbar>
</ion-header>

<ion-content>
    <button ion-button (click)="takePicture()">Take photo</button>
    <button ion-button (click)="sendData()">Send</button>
    <ion-card>
        <ion-card-content>
            <img [src]="base64Image" *ngIf="base64Image" />
        </ion-card-content>
    </ion-card>
</ion-content>

打字稿文件：

import {Component} from '@angular/core';
import {Camera} from 'ionic-native';


@Component({
    selector: 'page-contact',
    templateUrl: 'contact.html'
})
export class ContactPage {

    public base64Image: string;

constructor() {

}

takePicture() {
    Camera.getPicture({
        destinationType: 0,
        targetWidth: 1000,
        targetHeight: 1000
    }).then((imageData) => {
        this.base64Image = "data:image/jpeg;base64," + imageData;
    }, (err) => {
        console.log(err);
    });
}
}

Answer 1

更改getPicture（）中的第一个参数：

destinationType: Camera.DestinationType.DATA_URL,

编辑：离子视图与插件不兼容。您可以做的唯一真正的测试是在设备上运行。我已经尝试过你的代码，它在我的Android手机上运行。

Answer 2

Camera.getPicture({
        destinationType: Camera.DestinationType.DATA_URL,
        targetWidth: 1000,
        targetHeight: 1000,
        encodingType: Camera.EncodingType.JPEG,
        sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
        allowEdit:true }).then((imageData)=>{

        this.images.push(imageData);
    });

试试上面的代码。它可以在iOS模拟器中使用。

离子2相机照片没有显示

2 个答案: