Ionic2 Cordova相机无法工作

时间:2017-03-22 04:46:11

标签: ios cordova ionic2

我正在尝试关注this tutorial,它概述了iOS上一个非常简单的相机应用。我可以使用ionic build ios成功构建,并可以在XCode中打开它,没有任何警告或错误。我可以部署到我的iPhone 7,当它成功显示启动画面时,它只显示一个空白的白色屏幕。

的src /页/家/ home.ts:

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

@Component({
    selector: 'page-home',
    templateUrl: 'home.html'
})

export class HomePage {
    public base64Image: string;
    constructor(public navCtrl: NavController) {
        this.base64Image = "https://placehold.it/150x150";
    }

    public takePicture() {
        Camera.getPicture({
                quality : 75,
                destinationType : Camera.DestinationType.DATA_URL,
                sourceType : Camera.PictureSourceType.CAMERA,
                allowEdit : true,
                encodingType: Camera.EncodingType.JPEG,
                targetWidth: 300,
                targetHeight: 300,
                saveToPhotoAlbum: false
        }).then(imageData => {
                this.base64Image = "data:image/jpeg;base64," + imageData;
        }, error => {
                console.log("ERROR -> " + JSON.stringify(error));
        });
    }
}

的src /页/家/ home.html的:

<ion-header>
    <ion-navbar>
        <ion-title>
            Ionic 2 Camera
        </ion-title>
        <ion-buttons end>
            <button (click)="takePicture()">
                <ion-icon name="camera"></ion-icon>
            </button>
        </ion-buttons>
    </ion-navbar>
</ion-header>

<ion-content padding>
    <img src="{{ base64Image }}" />
</ion-content>

我的ionic info输出:

Cordova CLI: 6.5.0 
Ionic Framework Version: 2.2.0
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.1.4
ios-deploy version: 1.9.1 
ios-sim version: 5.0.4 
OS: macOS Sierra
Node Version: v7.5.0
Xcode version: Xcode 8.2.1 Build version 8C1002

当我在XCode中时,我也尝试在info.plist中的Camera / Photo隐私键中添加注释,但这似乎没有帮助。

1 个答案:

答案 0 :(得分:0)

尝试使用

ionic serve -l

以获取console.log错误。 或者在模拟器的情况下,您可以在 Chrome开发者工具

中使用remote debugging