同じページにカメラで撮影した画像を表示する

Question

携帯電話のメモリにアクセスせずに、同じページにカメラで撮影した画像を表示しようとしています。 Watsappのように、私たちがそこからクリックしてすぐにアップロードする方法です。つまり、キャプチャボタンがある場所に同じものをキャプチャして自動的に表示するようなものです。あなたはあなたの中に続いて、この$scope.image.src="data:image/jpeg;base64," + imageData;

のような範囲にimage.srcを宣言する必要が

.controller('CameraCtrl', function($scope, $cordovaCamera) { 

    document.addEventListener("deviceready", function() { 

    var options = { 
     quality: 50, 
     destinationType: Camera.DestinationType.DATA_URL, 
     sourceType: Camera.PictureSourceType.CAMERA, 
     allowEdit: true, 
     encodingType: Camera.EncodingType.JPEG, 
     targetWidth: 100, 
     targetHeight: 100, 
     popoverOptions: CameraPopoverOptions, 
     saveToPhotoAlbum: false, 
     correctOrientation:true 
    }; 

    $cordovaCamera.getPicture(options).then(function(imageData) { 
     var image = document.getElementById('myImage'); 
     image.src = "data:image/jpeg;base64," + imageData; 
     }, function(err) { 
     // error 
    }); 

    }, false); 

}) 

app.js

.state('tab.detail', { 
    url: '/new-order/id', 
    views: { 
    'tab-new': { 
     templateUrl: 'templates/detail.html', 
     controller: 'DetailCtrl' 
    } 
    } 
}) 

.state ('camera',{ 
    url:'/camera', 
    templateUrl: 'templates/detail.html', 
    controller:'CameraCtrl' 
}) 

HTML

 <ion-content> 
     <div> 
      <div class="col text-right"> 
      <p> 
       <a href="#/camera" class="camera-icon" ><i class="icon ion-camera"></i></a> 
      </p> 
      </div> 
     <p> 
     <img ng-src="image.src" /> 
     <p> 
    </div> 
</ion-content> 

Answer 1

HTMLのような画像をバインドthis <img ng-src="image.src"/>