angularjs - Ionic- display picture taken with camera on same page -
i'm trying display image captured through camera on same page without visiting phone's memory. watsapp, way click , upload right away there only. so, capture , display automatically on same page, have capture button.
.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>
you need declare image.src on scope $scope.image.src="data:image/jpeg;base64," + imagedata;
then in html bind image <img ng-src="image.src"/>
Comments
Post a Comment