离子/科尔多瓦相机为angularJS的新手

Mat*_*kin 0 android angularjs cordova yeoman ionic-framework

我正在尝试使用相机.我搜索了一个例子或指南,但我找不到任何东西.

我想做的是只需按一下按钮打开相机,拍照,然后显示图像 - 全部使用离子和角度.

小智 6

这就是我做的

index.html的:

<ion-nav-buttons side="left">
    <button menu-toggle="left"class="button button-icon icon ion-navicon"></button>
</ion-nav-buttons>


<ion-content class="has-header contentPadding"> 

     <div class="form-group padding-top">                   
          <button class='button button-positive' data-ng-click="takePicture()">
            {{text.buttonTitle}}
          </button> 
      </div>

      <div class="item item-image">
            <img ng-src="{{cameraPic}}"/>
      </div>                    

</ion-content>
Run Code Online (Sandbox Code Playgroud)

控制器:

 $scope.takePicture = function(){   
        var cameraOptions = {
            quality: 50,
            destinationType: Camera.DestinationType.DATA_URL                
         };
        var success = function(data){
        $scope.$apply(function () {
             /*
               remember to set the image ng-src in $apply,
               i tried to set it from outside and it doesn't work.
             */
               $scope.cameraPic = "data:image/jpeg;base64," + data;
             });
         };
        var failure = function(message){
             alert('Failed because: ' + message);
        };
        //call the cordova camera plugin to open the device's camera
        navigator.camera.getPicture( success , failure , cameraOptions );            
    };
Run Code Online (Sandbox Code Playgroud)