Angularjs $http get always return null or empty string when retrieving username from mvc controller [duplicate]

I'm new to Angularjs and i want to retrieve username from Asp.net MVC controller. In my angular's controller, i have a factory method "getUserName" that gets username from mvc controller. Below is the code

FACTORY

appControllers.factory('testFactory', ['$http', function ($http) {
        var factory = {};

        factory.getUserName = function(){
            return $http.get('Home/GetUser').then(function (result) { return result.data; });
        }

        return factory;
    }]);

In the app controller, i called the factory service "getUserName" to get current active user. Please see code and behavior.

APP CONTROLLER

appControllers.controller('contrlA', ['$scope', '$http', 'testFactory', function ($scope, $http, testFactory) {
     var user = ' ';
        testFactory.getUserName().then(function (result) {
            user = result;
            console.log('print out of console suser ' + user); // this prints my windows login name "print out of console suser AMAZO\demo.b"
        });
        console.log('print out of console user ' + user); // this is the problem, note username is missing "print out of console user"
 }]);

ASP.NET MVC ACTION

 [HttpGet]
        public string GetUser() 
        {
            var userName = User.Identity.Name;

            return userName;
        }

SUMMARY: I want to assign the result of getUserName to a variable so that i can use as input for other methods. Please forgive me if the question is too simple, i'm new to angularjs and have been on this issue for over 4 days.