如何使用angularjs从异步调用定义全局变量？

Question

I want to use single_video variable in outside of the controller function. It prints well in first console log. However it gives a single_video is undefined error in second console.log which is outside of the controller function. Because of the asynchronousity.

   var single_video;
var app = angular.module('myApp', []);
app.controller('randomVideo', function($scope, $http) {
    var onSuccess = function(response){
        $scope.video = response.data; 
        single_video = $scope.video;
        //First console.log
        console.log('1st ID='+single_video.yt_id);
    };
    var onError = function(reason){
        $scope.error = "There is an error about getting random_video.php";
    };
   $http.get("http://www.ytmdb.com/ytvideo/api/random_video.php")
   .then(onSuccess, onError);
});
//Second console.log
console.log('2nd ID='+single_video.yt_id);

Answer 1

You can create a function that you invoke inside the success callback passing your variable as a parameter to the function:

var app = angular.module('myApp', []);
app.controller('randomVideo', function($scope, $http) {
    var onSuccess = function(response){
        $scope.video = response.data; 
        single_video = $scope.video;
        //First console.log
        console.log('1st ID='+single_video.yt_id);
        test(single_video.yt_id);
    };
    var onError = function(reason){
        $scope.error = "There is an error about getting random_video.php";
    };
    $http.get("http://www.ytmdb.com/ytvideo/api/random_video.php")
    .then(onSuccess, onError);
});
function test(a)
{
    console.log('2nd ID='+a);
}

Answer 2

Define your global variables in a factory service and inject the service in your angular controller where ever you need. (Note: try to put everything in an IIFE)

Global Variables using services, here is an example:

var myApp = angular.module('myApp',[]);
myApp.factory('MySvc', function() {
return {
  name : 'your name'
};
});

and in a controller:

function MyCtrl($scope, MySvc) {
$scope.name = MySvc.name;
}