title: ajax request data not getting loaded - Angular JS
body: <p>I am trying to populate a ListBox dynamically. But it's not working with ajax request.</p>
  
  <p>Here's what I am doing.</p>
  
  <p>My Ajax request :</p>
  
  <pre><code>angular.module("confessions_module").factory("Universities",function(){
  
      var service = {};
  
          service.getUniversitiesAjax=function(callback)
          {
              $.ajax({
                  type:'GET',
                  url:'myurl',
                  success:function(e)
                  {
                      universitiesList = $.parseJSON(e);
                      callback(universitiesList);
                  }
  
              });
  
  //                var a = [{ 'name':'asdasdsad','id':123},{ 'name':'mozi','id':123}];
   //              callback(a)
          }
      return service;
  });
  </code></pre>
  
  <p>My Controller calling the function and populating the array:</p>
  
  <pre><code>   Universities.getUniversitiesAjax(
      function(university)
      {
  
          for(var i=0;i&lt;university.length;i++)
          {
              var unii = { 'name' : university[i].name , 'id' : university[i].id };
              $scope.unis.push(unii);
          }
      }
  );
  </code></pre>
  
  <p>My View:</p>
  
  <pre><code>                   &lt;select id="dd_universities"&gt;
                          &lt;option ng-repeat="uni in unis"&gt;{{uni.name}}&lt;/option&gt;
                      &lt;/select&gt;
  </code></pre>
  
  <p>Now there are two lines commented in <code>My Ajax Request</code> code. When I <code>uncomment</code> those two lines , my data gets populated with no problem. But whenever I try to populate it using the ajax request code as it is happening now. It does not work. What could be the problem ?</p>