How to display response data ($http) from server in AngularJS

Question

How to display reponse data (get) from server in AngularJS

in my code I need to alert $scope.orders inside that controller but it willll not show..

function OrderController($scope,$http)
{
    var orderPromise = $http.get("../api/order");

    orderPromise.success(function(data, status, headers, config) 
    {
        $scope.orders=data
        alert(JSON.stringify($scope.orders))  // First alert 
    });

    orderPromise.error(function(data, status, headers, config) 
    {
        alert("Error");

    });

    alert(JSON.stringify($scope.orders))    // Second alert 
}

How can i access $scope.orders to outside the success fun() Here I am alerting $scope.data in two times In here First Alert is shown but Second Alert is nothing to show why? How to show second one?

Answer 1

Second alert will not show because there's nothing in $scope.orders when you alert it. That's the nature of asynchronous calls, only when you enter the success/error sections will you have something there (or not...).

Until the server returns your response and the success/error functions trigger, that variable is still unpopulated since $scope.orders=data hasn't run.

You should read the docs for some more info, and get some deeper understanding into how promises work.