title: Get Ajax data into Angular grid
body: <p>Using Angular Grid, I get the ajax get data in console.log. But an empty grid. </p>
  
  <p>The console log reads:</p>
  
  <pre><code>[13:56:11.411] now!!
  [13:56:11.412] []
  [13:56:11.412] now!!
  [13:56:11.556]  &lt;there is data returned from console.log(getData); &gt; 
  </code></pre>
  
  <p>This is the js file.</p>
  
  <pre><code>// main.js
  var app = angular.module('myApp', ['ngGrid']);
  
  var getData = [];
  
  function fetchData() {
      var mydata = [];
  
      $.ajax({
          url:'/url/to/hell',
          type:'GET',
          success: function(data) {
  
              for(i = 0, j = data.length; i &lt; j; i++) {
                  mydata[i] = data[i];
              }
              getData = mydata;
              console.log(getData);
          }
      });    
   }
  fetchData();     
  
  
  app.controller('MyCtrl', function($scope) {    
  
      console.log('now!!')
      console.log(getData)
      console.log('now!!')
  
      $scope.myData = getData
  
  
      $scope.gridOptions = { 
          data: 'myData',
          showGroupPanel: true
      };
  });
  </code></pre>
  
  <p>New Js file:</p>
  
  <p>// main.js</p>
  
  <pre><code>var app = angular.module('myApp', ['ngGrid']);
  
  app.controller('MyCtrl', function($scope, $http) {          
  function fetchData() {
      $http({
          url:'/url/to/hell',
          type:'GET'})
          .success(function(data) {
              $scope.myData = data;       
              $scope.gridOptions = { 
                      data: 'myData',
                      showGroupPanel: true
                  };              
          });         
  }   
  fetchData();    
  });
  </code></pre>
  
  <p>HTML file.</p>
  
  <pre><code>&lt;html ng-app="myApp"&gt;
          &lt;head lang="en"&gt;
              &lt;meta charset="utf-8"&gt;
              &lt;title&gt;Blank Title 3&lt;/title&gt;  
              &lt;link rel="stylesheet" type="text/css" href="http://angular-ui.github.com/ng-grid/css/ng-grid.css" /&gt;
              &lt;link rel="stylesheet" type="text/css" href="../static/css/style.css" /&gt;
              &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"&gt;&lt;/script&gt;
              &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"&gt;&lt;/script&gt;
              &lt;script type="text/javascript" src="http://angular-ui.github.com/ng-grid/lib/ng-grid.debug.js"&gt;&lt;/script&gt;
              &lt;script type="text/javascript" src="../static/js/main.js"&gt;&lt;/script&gt;
          &lt;/head&gt;
  
          &lt;body ng-controller="MyCtrl"&gt;
  
              &lt;div class="gridStyle" ng-grid="gridOptions"&gt;&lt;/div&gt;
          &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>