angularjs $ http.get, aby json nie działał w warstwie usług

Opracowuję aplikację angularjs jako część mojej nauki angularjs. Mam kontrolerów i stamtąd dzwonię do warstw usług.

leagueManager.service("teamsService", function($http){
    var teams = {};
        $http.get('data/teams.json').then(function(data) {
        teams = data;
    });
    this.getTeams = function(){
        return teams;
    };

});

Zauważyłem, że ze względu na asynchroniczną naturę $ http.get.then rzeczy, dane nie są pobierane natychmiast i dlatego nie dostanę „zespołów”, gdy wywołałbym getTeams () z kontrolera (teamsController), dostałbym nic.

Każdy pomysł, jak rozwiązać ten problem?

Drugie podejście: Po przeczytaniu o odroczeniu i obietnicach na kanciastych, jak sugeruje poniższy post, spróbowałem postępować, ale nadal nie ma to żadnego skutku. Moja zmiennazespoły nie jest zaludniony tak, jak chcę, a potem jest zaludniony i to nie pomaga w moim interfejsie użytkownika:

Mój kontroler teamsController.js

leagueManager.controller('teamsController', function($scope, $location, teamsService, $routeParams){
//init function to initialize data when controller is called everytime.
var init = function(){
        $scope.teams = [];
        var promise = teamsService.getTeams();
        promise.then(
        function(data){
            console.log("teams after promise:="+data);
            $scope.teams = data;
        }
        ,function(reason)
        {
                alert('Failed: ' + reason);
        }
        );
        console.log("teams in the scope:="+$scope.teams);
};

init();
});

A oto mójWarstwa serwisowa teamsService.js

leagueManager.service("teamsService", function($http, $q){
this.getTeams = function(){
  var deferred = $q.defer();
     var url = 'data/teams.json';
     $http.get(url).success(function(data, status) {
         // Some extra manipulation on data if you want...
         deferred.resolve(data);
     }).error(function(data, status) {
         deferred.reject(data);
     });
     return deferred.promise;
}
});

Czy ty lub ktoś może mi pomóc, co robię źle? To jest to, co jest drukowane w konsoli przeglądarki po wykonaniu:

zespoły w zakresie: = teamsController.js: 27

zespoły po obietnicy: = [obiekt obiektu], [obiekt obiektu], [obiekt obiektu], [obiekt obiektu], [obiekt obiektu]

To po prostu pokazuje, że dostaję obiekt json, ale nie w momencie, kiedy chcę. Z jakiegoś powodu ta obojętna / obiecująca rzecz nie miała wpływu.

PROSZĘ POMÓC NOWYM ANGULOWANIU KĄTOWEGO

questionAnswers(2)

yourAnswerToTheQuestion