CODEWITHSUNDEEP
javascriptdata-bindingangularjscontroller
Abhishek Subradeep
Abhishek Subradeep

Reputation: 296

How to fill scope variable via Ajax get inside the controller?

In my current code I am using a dummy way to get the data. Its like

var controlMeetings = $.ajax({
        type: "GET",
        url: "./Info.xml",
        contentType: "text/xml",
        dataType: "xml",
        success: function (dataSource) {           

            controlMeetings = PureJson(dataSource);         
        }
});

function MeetingsCtrl( $scope, $compile ) {

  $scope.meetings = controlMeetings;  
  $('#div1').html(
       $compile(
         '<ul><li ng-repeat="meeting in meetings"><a>{{meeting.count}}</a> <ul><li ng-repeat="child in meeting.children">{{child.meet}}</li></ul></li></ul>'
       )($scope)
     );
  $('#div1').prepend('<div class="mHeader">Race cources</div>');


}

Its obviously not good (yes I am ashamed from this code), but its working atm. The issue is how to acutally populate the $cope.meetings variable inside the controller and avoid usage of the global variable?

Upvotes: 0

Views: 417

Answers (1)

the-lay
the-lay

Reputation: 1481

I tried to re-write your example using AngularJS methods.

Controller:

function MeetingsCtrl ($scope) {

  $http.get('./Info.xml').success(function (data) {
      $scope.meetings = data;
    });

}

View file:

<div id="div1">
  <div class="mHeader">Race cources</div>
  <ul>
    <li ng-repeat="meeting in meetings">
      <a>{{meeting.count}}</a>
        <ul><li ng-repeat="child in meeting.children">{{child.meet}}</li></ul>
    </li>
  </ul>
</div>

Upvotes: 1

Related Questions