Angular $rootScope Properties undefined after Asynchronous API

Question

I have main controller:

.controller('mainCtrl', ['$scope', '$rootScope', 'Data', '$http', '$log', '$filter', '$q', '$timeout', function($scope, $rootScope, Data, $http, $log, $filter, $q, $timeout){

            Data.get('customers').then(function(data){
                $scope.customers = data.data;
                $rootScope.language = data.data[0].language;
            });

            $rootScope.word_pub_curr_lang = 'word_pub_' + $rootScope.language;
            console.log('from maincrtl', $rootScope.word_pub_curr_lang);

    }]);

The problem is that I can't receive $rootScope.word_pub_curr_lang or $rootScope.language - are always undefined.

Answer 1

It is getting undefined because, it gets printed before you actually get the value from the request, place them inside,

controller('mainCtrl', ['$scope', '$rootScope', 'Data', '$http', '$log', '$filter', '$q', '$timeout', function($scope, $rootScope, Data, $http, $log, $filter, $q, $timeout){
            Data.get('customers').then(function(data){
                $scope.customers = data.data;
                $rootScope.language = data.data[0].language;
                $rootScope.word_pub_curr_lang = 'word_pub_' + $rootScope.language;
               console.log('from maincrtl', $rootScope.word_pub_curr_lang);
            });

    }]);