angularjs - retrieve previous photo taken with camera with ionic framework -


it's first app ionic

i'm trying take photo in camera tab , retrieve photo in filters tab, cant, here code

<!doctype html> <html>   <head>     <meta charset="utf-8">     <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">     <title></title>      <link href="lib/ionic/css/ionic.css" rel="stylesheet">     <link href="css/style.css" rel="stylesheet">      <!-- if using sass (run gulp sass first), uncomment below , remove css includes above     <link href="css/ionic.app.css" rel="stylesheet">     -->      <!-- ionic/angularjs js -->     <script src="lib/ionic/js/ionic.bundle.js"></script>      <!-- cordova script (this 404 during development) -->     <script src="js/ng-cordova.min.js"></script>     <script src="cordova.js"></script>      <!-- app's js -->     <script src="js/app.js"></script>   </head>   <body ng-app="starter">  <ion-pane>    <ion-header-bar class="bar-balanced">     <h1 class="title vcrfont">dstry_cam</h1>   </ion-header-bar>    <ion-tabs class="tabs-balanced tabs-icon-top">    <ion-tab title="wtf?" icon-on="ion-ios-help" icon-off="ion-ios-help-outline">     <ion-pane>       <div id="welcome">         <h2>welcome to<br>dstry_cam</h2>          <h3>instructions:</h3>         <h3>1.shoot</h3>         <h3>2.destroy</h3>         <h3>3.share</h3>        </div>        </ion-pane>   </ion-tab>    <ion-tab title="camera" icon-on="ion-ios-camera" icon-off="ion-ios-camera-outline">   <ion-pane ng-controller="examplecontroller" class="centrar">     <img ng-show="imguri !== undefined" ng-src="{{imguri}}">     <img ng-show="imguri === undefined" ng-src="http://placehold.it/300x300">     <button class="button" ng-click="takepicture()">take picture</button>     </ion-pane>   </ion-tab>    <ion-tab title="filters" icon-on="ion-ios-flask" icon-off="ion-ios-flask-outline">     <ion-pane ng-controller="examplecontroller">       <img ng-show="imguri !== undefined" ng-src="{{imguri}}">       <img ng-show="imguri === undefined" ng-src="http://placehold.it/300x300">     </ion-pane>   </ion-tab>    <ion-tab title="share" icon-on="ion-ios-upload" icon-off="ion-ios-upload-outline">     <ion-pane>     <button class="button button-light shurmargen">       heheh     </button>     </ion-pane>   </ion-tab>   </ion-tabs> </ion-pane> 

and .js

.controller("examplecontroller", function($scope, $cordovacamera) {      $scope.takepicture = function() {         var options = {              quality : 75,              destinationtype : camera.destinationtype.data_url,              sourcetype : camera.picturesourcetype.camera,              allowedit : true,             encodingtype: camera.encodingtype.jpeg,             targetwidth: 300,             targetheight: 300,             popoveroptions: camerapopoveroptions,             savetophotoalbum: false         };          $cordovacamera.getpicture(options).then(function(imagedata) {             $scope.imguri = "data:image/jpeg;base64," + imagedata;         }, function(err) {             // error occured. show message user         });     }  }); 

the camera works well, photo shows in camera tab, , need show in filters , share tabs too

thanks!

    $cordovacamera.getpicture(options).then(function(imagedata) {         $scope.$apply(function () {             $scope.imguri = "data:image/jpeg;base64," + imagedata;         });                 }, function(err) {         // error occured. show message user     }); 

you have use $scope.apply apply changes in $scope variable.


Comments

Popular posts from this blog

powershell Start-Process exit code -1073741502 when used with Credential from a windows service environment -

twig - Using Twigbridge in a Laravel 5.1 Package -

c# - LINQ join Entities from HashSet's, Join vs Dictionary vs HashSet performance -