title: AngularJS: Rotate Image after Camera Capture
body: <p>I am taking a picture with my android phone using AngularJS technology on ionic framework. This is my code review in index.html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
  
        &lt;meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"&gt;
  
      &lt;title&gt;&lt;/title&gt;
  
      &lt;link href="lib/ionic/css/ionic.css" rel="stylesheet"&gt;
      &lt;link href="css/style.css" rel="stylesheet"&gt;
  
      &lt;!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
      &lt;link href="css/ionic.app.css" rel="stylesheet"&gt;
      --&gt;
  
      &lt;!-- ionic/angularjs js --&gt;
      &lt;script src="lib/ionic/js/ionic.bundle.js"&gt;&lt;/script&gt;
  
      &lt;!-- cordova script (this will be a 404 during development) --&gt;
      &lt;script src="cordova.js"&gt;&lt;/script&gt;
      &lt;script src="js/ng-cordova.min.js"&gt;&lt;/script&gt;
  
      &lt;!-- your app's js --&gt;
      &lt;script src="js/app.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body ng-app="starter"&gt;
  &lt;ion-content ng-controller="ExampleController"&gt;
      &lt;img ng-show="imgURI !== undefined" ng-src="{{imgURI}}"&gt;
      &lt;img ng-show="imgURI === undefined" ng-src="http://placehold.it/300x300"&gt;
      &lt;button class="button" ng-click="takePicture()"&gt;Take Picture&lt;/button&gt;
  
  &lt;/ion-content&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And this is my code in app.js</p>
  
  <pre><code>.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) {
              // An error occured. Show a message to the user
          });
      }
  });
  </code></pre>
  
  <p>My challenge is to rotate the image. If it were Java android I could easily rotate the image using Exif orientation but in this case I dont know how to go about it performing the rotation 90 degrees with angularjs. Please help me out. This is my first time!!!</p>