title: How to access angular scope variable in JavaScript file
body: <p>I'm really new to angular and javascript in general. I know there is probably an easy way to do this but I'm just having a hard time figuring it out. </p>
  
  <p>I have an angular service and controller defined.</p>
  
  <pre><code>var app = angular.module('nodeAnalytics', []);
  
  app.factory('myService', function($http) {
    var myService = {
      async: function() {
        // $http returns a promise, which has a then function, which also returns a promise
        var promise = $http.get('https://graph.facebook.com/lowes').then(function (response) {
          // The then function here is an opportunity to modify the response
          console.log(response);
          // The return value gets picked up by the then in the controller.
          return response.data;
        });
        // Return the promise to the controller
        return promise;
      }
    };
    return myService;
  });
  
  
  app.controller('MainCtrl', [
  '$scope', 'myService', '$window',
    function($scope, myService, $window){
      $scope.test = 'Hello world!';
       myService.async().then(function(d) {
        $scope.data = d.likes;
        $window.data = $scope.data;
        console.log($scope.data)
      });
  }]);
  </code></pre>
  
  <p>I know that in my html file I an use <code>{{data}}</code> to access <code>scope.data</code>.
  <code>$window.data</code> allows me to access the scope element in the browser but that has not been very helpful since I don't know how to give the javascript file access to window elements.  </p>
  
  <p>How do I access the data variable in a javascript/jquery file. </p>
  
  <p>I'm using highcharts and I want to put the value of data into a chart argument but I don't know how to access it.</p>
  
  <pre><code>  $('#container-rpm').highcharts(Highcharts.merge(gaugeOptions, {
              series: [{
                  data: {{data}},
              }]
          }));
  </code></pre>