Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

display image from image gallery in android using ionic framework

Hello i am trying to develop Android app to load images from images gallery. Here is code snipet. i am not able display image. Can some one point me where it went wrong?

*.html

<ion-view title="Account">
  <ion-content class="has-header padding">
    <h1>Upload Image</h1>
      <div class="account-picture">
          <button ng-click="ShowPictures()">Select Picture</button>
          <img src="ImageURI" id="smallimage">
          <input type="text" ng-model="ImageURI" size="30"/>
      </div>
  </ion-content>
</ion-view>

Controller.js

.controller('AccountCtrl', function($scope) {

    $scope.ImageURI = 'Select Image';
    function UploadPicture(imageURI) {

        $scope.ImageURI =  imageURI;
        alert($scope.ImageURI );
    }

    $scope.ShowPictures = function() {
        navigator.camera.getPicture(UploadPicture, function(message) {
                alert('get picture failed');
            }, {
                quality: 50,
                destinationType: navigator.camera.DestinationType.FILE_URI,
                sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY
            }
        );
    };
});

Here ia ImageURI i am receiving afetr selecting any file from image gallery:content://media/external/images/media/17. I blindly hard coded this value for my image src. But I am not seeing any. Any inputs here?

Also, the ImageURI is not binding for my text box too. Alert is display URI properly.

Its seeme pretty straight forward using normal phonegap app. But w/ ionic framework i am not abel to.

like image 220
Vamsidhar Mamillapalli Avatar asked Oct 02 '22 01:10

Vamsidhar Mamillapalli


1 Answers

you need to call $scope.$apply(); to tell angular your async function is finished. Also

$scope.ImageURI =  imageURI;
$scope.$apply(); 

also - you might get the same problem as I with the image - se my comments above.

like image 77
joeriks Avatar answered Oct 05 '22 11:10

joeriks