Document ready AJAX call

[Ian O'Sullivan]

Hi there

Total newbie here to AngularJS so prob a very simple question. How do I do an AJAX call after page load?

I've been following John Lindquist YouTube tutorial here: http://www.youtube.com/watch?v=WuiHuZq_cg4&list=PL1w1q3fL4pmgqpzb-XhG7Clgi67d_OHXz&index=23

So instead of using the statis JSON I want to get mine from the server like this;

$scope.getNewsSources = function () {

    $http({method: 'GET', url: 'http://~~~~/cms/latest_news/news_sources.js'}).

     success(function(data, status, headers, config) {

       // this callback will be called asynchronously

       // when the response is available

     //console.log(data);

     $scope.todos = data;

     //console.log ($scope.todos);

     }).

     error(function(data, status, headers, config) {

       // called asynchronously if an error occurs

       // or server returns response with an error status.

     });

    };

This works when bound to button like this;

<button ng-click="getNewsSources()"><i class="icon-thumbs-up"></i>Get News</button>

But how do I call it on page load instead of requiring a button?

Ta

[Chris Rhoden]

Your controller will not be instantiated until the page is loaded. Even if that weren't the case, because of the way that angular works, you should not worry about things like page loads. Just change the data attached to a $scope, and the view will be updated as necessary.

So, if you want to make that AJAX call, just make the AJAX call. Don't worry about when your page is loaded.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.

--
chrisrhoden

[Ian O'Sullivan]

Thanks for reply Chris. I understand what you mean by updating the $scope variable and I can get it to work as expected using the function ($scope.getNewsSources) in my initial post. I wasn't clear earlier though (my bad). This function though is inside the 'ToDoCtrl' controller and so I can only get it to execute by linking it to an ng-click. How can I get it to execute via script without needing a click? Problem is linked to the fact that $http has to be passed into the controller? How can I do an AJAX call in script?

Hope I'm making sense.

Ta

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/uc7SmXbfmuI/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.

[Chris Rhoden]

Execute $http in your controller instead of binding it to a function.

--
chrisrhoden, from my telephone

[Mike Alsup]

Roughly what you have now (http request bound to function invocation which is bound to button click):

module.controller('ToDoCtrl', function($scope, $http) {

    $scope.getNewsSources = function () {

        $http(…).success(function(data) {

            $scope.todos = data;

        }

    }

}

What you want (http request bound to controller instantiation):

module.controller('ToDoCtrl', function($scope, $http) {

    $http(…).success(function(data) {

        $scope.todos = data;

    }

}

You can do whatever you like in the controller's constructor, you don't have to nest functionality/logic inside $scope functions.  

[Ian O'Sullivan]

Thanks guys. The fact that the controller function is called via '<div ng-controller="TodoCtrl">' escaped me. Getting the hang of it now...