title: How To Access ngCordova Camera Image From Inside JavaScript
body: <p>I am currently developing a photo-editing app with the Ionic Framework. At the moment, I have used an open-source JS Drag &amp; Drop photo editor and have modified accordingly but I need to be able to access the image that the user creates with the ngCordova Camera plugin outside of the AngularJS and in a separate script with only JS.</p>
  
  <p>I've decided to take on the ( <strong>angular.element(document.getElementById('editor')).scope().</strong> ) approach but have come to no avail. </p>
  
  <p>I'm starting to think that isn't going to be possible but that's why I came here to give it a final shot.</p>
  
  <p>Here's some code from the editor. Yoda is the background image which works when set to a locally stored image.</p>
  
  <pre><code>        window.onload = function() {
         //THIS IS WHERE WE WILL ACCESS THE IMAGE GENERATED BY ngCamera
  
          var sources = {
              yoda: angular.element(document.getElementById('editor')).scope().pictureUrl
          };
          loadImages(sources, initStage);
  
      };
  </code></pre>
  
  <p>Below is where we take the picture and assign its url to $scope.pictureUrl. Ignore the adding to array part, that is for syncing the images to Firebase.</p>
  
  <pre><code> $cordovaCamera.getPicture(options)
          .then(function(imageData) {
              syncArray.$add({image: imageData});
              $scope.pictureUrl= 'data:image/jpeg:base64,' + data
              .then(function() {
                  alert("Image has been uploaded");
              });
          }, function(error) {
              console.error(error);
          });
    };
  </code></pre>
  
  <p>Pastebin for the whole app.js file: <a href="http://pastebin.com/8A8C4hL3" rel="nofollow">http://pastebin.com/8A8C4hL3</a></p>
  
  <p>In brief, I am looking for a way to access an image created by ngCordova's Camera plugin inside of some actual JS and outside of the AngularJS used by the Ionic Framework.</p>