无法读取未定义离子相机的属性“getPicture”

Question

此代码返回：

 Cannot read property 'getPicture' of undefined

不知道我做错了什么，你能帮我弄一下密码吗？

我的应用程序：

Angular.module(“Todo”、“离子型”、“Todo.Controller”、“ngStorage”、“Todo.services”、“ngCordova”)

我的财务主任：

.controller('profileEditCtrl', function($scope,Camera, $localStorage,
 $cordovaCamera) 
     {  
        $scope.$storage = $localStorage.$default({ data:[]});

    $scope.takePicture = function() 
    {
        navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
            destinationType: Camera.DestinationType.DATA_URL }); 

      function onSuccess(imageData) {
        var image = document.getElementById('myImage');
        image.src ="data:image/jpeg;base64," + imageData;       
    }

    function onFail(message) {
        alert('Failed because: ' + message);
    }       

}});

Answer 1

• 您的代码是正确的，只需添加一个带有ng-click="takePicture()"的html按钮。
• 这里没有问题，肯定是浏览器 "cannot read property 'getPicture' of undefined"，因为它没有配置您定义的移动相机，这意味着您应该使用以下实际设备在上测试应用程序： > ionic run android。
• 请注意，Google的新更新提供了一个新功能，如果设备连接到PC/膝上型计算机，它可以帮助您在浏览器上测试设备，测试转到Chrome的导航面板>> More tools >> panel，或者只需转到以下链接： chrome://inspect/#devices
• 我相信如果你在应用程序中安装了插件cordova plugin add org.apache.cordova.camera，你的相机就会正常工作， 希望这能帮到你。

Answer 2

在为我的科多瓦项目尝试了各种解决方案之后，我只是继续使用内置JavaScript API。实质上：

async function startCapturing() {   // get ready to shoot
    await getPermission('android.permission.CAMERA');
    let stream = await navigator.mediaDevices.getUserMedia({ video: {width: 480, height: 320, facingMode:'environment' }, audio: false });
    let video = document.getElementById("pVideo");   // a <video> element
    video.srcObject = stream;
    video.play();
    video.style.display = "block";
}

function shootPhoto(){       // take a snapshot
    let video = document.getElementById("pVideo");
    let canvas = document.getElementById("pCanvas");  // a <canvas> element
    let context = canvas.getContext('2d');
    context.drawImage(video,0,0,480,320);
    document.getElementById('fsPhotoI').src = Photo.current.src = canvas.toDataURL('image/png');
    Photo.current.changed = Profile.current.changed = true;
    video.style.display = "none";
}

特别是，有些插件不适合我，因为他们不能马上使用Android后置摄像头。getUserMedia中的以下内容(.)有诀窍：

facingMode:'environment'

还要确保你在你的AndroidManifest.xml中拥有相机的权限。