Question: I have this short all in one Angular script

```
<script src="http://code.angularjs.org/1.2.14/angular.min.js"></script>

<script>
var myApp = angular.module('myApp', []);

myApp.controller('MainController', ['$scope', '$http', function($scope, $http) {

    var getContent = function(filename){
        var fc = 'empty';
        $http.get(filename+'.json').success(function(data) {
            fc = data;
        });
        return fc;
    };

    $scope.filename = 'file1';
    $scope.content = getContent($scope.filename);
}]); 
</script>

<div ng-app="myApp" ng-controller="MainController">
{{filename}} - {{content}}   
</div>

```

and a file in the same directory `file1.json`:

```
[
  {
    "file": "1"
  }
]

```

I can't get the function at `getContent` to return the file's content. Where am I wrong ?

Answer: 
$http.get sends an asynchronous request to the server. It does not wait for the response. Function getContents continues and returns 'empty'. After a while, when the response arrives, fc = data is executed, but this is not assigned to $scope.content.

Instead, getContents should return a promise object and the caller should have the callback function (in your example, you have used 'success', but [that is now deprecated](https://docs.angularjs.org/api/ng/service/$http#deprecation-notice) and should be replaced by 'then').

This is how it works:

```
    myApp.controller('MainController', ['$scope', '$http', function($scope, $http) {

        var getContent = function(filename){
            return $http.get(filename+'.json');
        };

        $scope.filename = 'file1';
        getContent($scope.filename).then(function(data) {
            $scope.content = data;
        });
    }]);

```
Your function returns a promise, not the result of the function itself as that is executed asynchronously.

You want something close to:

```
getContent($scope.filename).then(function(response){ $scope.content = response; });

```

As a side note, it is better to avoid $scope, and to use the controllerAs syntax instead. Only use $scope if you need functionality specifically provided by that service.

With controllerAs syntax,, you can just use *this* in your controller, instead of *$scope*, and then in your view, use *ctrlAs.*.