angularjs $ http.get得到JSON在服务层不工作 [英] angularjs $http.get to get json not working in the service layer

问题描述

我开发一个应用程序angularjs作为我angularjs学习的一部分。我有控制器，并从那里我打电话的服务层。

I am developing an angularjs app as a part of my angularjs learning. I have controllers and from there I am calling service layers.

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

}）;

我注意到，由于的$ http.get.then东西异步特性，数据不能立即取回，所以我不会在团队的时候我会打电话从控制器getTeams（）（teamsController）我会得到什么。

I noticed that because of the asynchronous nature of $http.get.then stuff, the data is not retrieved immediately and hence I would not get the "teams" when I would call getTeams() from the controller (teamsController), I would get nothing.

任何想法，我该如何解决这个问题？

Any idea how do I resolve this?

第二次尝试：
阅读有关延迟和棱角分明的承诺由以下职位的建议后，我尝试以下，但它仍然没有效果。我的变量小组是不是被填充，因为我想和他们事后填充，并且没有在我的UI帮助：

Second Attempt: After reading about deferred and promises on angular as suggested by the post below, I tried following but it still has no effect. My variable teams is not being populates as I want and they are populated afterwards and that is not helping in my UI:

的我的控制器的 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();
});

和这里是我的 ServiceLayer 的 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;
}
});

您还是有人可以帮助我什么，我做错了什么？
这是在浏览器控制台在执行时打印的：

Can you or someone help me what I am doing wrong? This is what is printed in the browser console upon execution:

团队范围：= teamsController.js：27

teams in the scope:= teamsController.js:27

承诺后团队：= [对象的对象]，[对象的对象]，[对象的对象]，[对象的对象]，[对象的对象]

teams after promise:=[object Object],[object Object],[object Object],[object Object],[object Object]

这只是说明我得到了JSON对象，但不是我想要的时间。出于某种原因，这个递延/承诺的事情没有影响。

This simply shows that I do get the json object but not at the time I want. For some reason this deffered/promise thing had no impact.

请帮助这个新的角度ENTHUSIAST

推荐答案

是的，你需要使用一个承诺接口。因此，而不是返回一个对象队伍，直接你必须返回一个承诺：

Yeah you will need to use a promise interface. So instead of returning a teams object, directly you'll have to return a promise:

无极资源：

• http://egghead.io/lessons/angularjs-promises


• http://docs.angularjs.org/api/ng.$q

• http://egghead.io/lessons/angularjs-promises
• http://docs.angularjs.org/api/ng.$q

在该服务：

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

然后在控制器：

$scope.team = {};

var promise = teamsService.getTeams();
promise.then(function(data) {
    $scope.teams = data;
});

这篇关于angularjs $ http.get得到JSON在服务层不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！