当前位置: 首页 > 面试题库 >

angularjs $ http.get获取json在服务层中不起作用

颜瀚漠
2023-03-14
问题内容

我正在开发angularjs应用程序作为我的angularjs学习的一部分。我有控制器,从那里我叫服务层。

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东西的异步特性,不会立即检索数据,因此当我从控制器(teamsController)调用getTeams()时,我不会得到“
teams”,我会得到没有。

知道我该如何解决吗?

第二次尝试: 在阅读了有关以下文章所建议的关于角度的递延和诺言之后,我尝试了跟随,但仍然没有效果。我的变量 团队
没有按照我的意愿进行填充,后来又被填充了,这对我的UI没有帮助:

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

您或其他人可以帮助我做错什么吗?这是执行后在浏览器控制台中显示的内容:

范围内的团队:= teamController.js:27

承诺后的团队:= [对象对象],[对象对象],[对象对象],[对象对象],[对象对象]

这只是表明我确实得到了json对象,但没有得到我想要的时间。由于某种原因,这个延迟/承诺的事情没有影响。

请帮助这个新的角度爱好者


问题答案:

是的,您将需要使用一个Promise接口。因此,与其直接返回一个团队对象,不如直接返回一个promise:

承诺资源:

  • 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;
});


 类似资料:
  • 因此,我在一个控制器中有一个非常简单的代码片段,在这个代码片段中,我使用从外部文件中获取数据,它工作得很好!但是当我使用时,我会在控制台中得到一个

  • 问题内容: 我正在尝试从Angular服务hero.service.ts获取json数据。当在MemoryDataService中使用伪造的HTTP API时,一切正常,我从in-memory- data.service.ts文件中获取json数据。但是,当我尝试从真实的json文件中获取数据时,它不起作用,并且在浏览器中出现错误“找不到集合”。 以下是文件内容(所有3个文件都位于app /文件夹

  • 应用服务器:IBM Websphere Java 6 问题: 以下是web应用程序的文件夹结构: WEB-INF/库/道具/ 问题是下面的代码不工作: this.getClass(). getResourceAsStream('/props'/fileName),其中fileName是WEB-INF/lib/pros的props文件夹中的有效文件名。 调用上述方法的类位于JAR中,并包含在lib中

  • 我正在尝试使用http.get从服务器检索json文件,并从组件订阅可观察的内容。但是,它返回的是一个错误,而不是数据。 你能告诉我哪里出了问题吗: 下面是组件: 我正在使用Angular和rxjs库的最新版本。 请帮忙。

  • 问题内容: 当我使用我的代码时,但是如果我使用$ http.post,则永远不会将参数获取到请求.php文件中。 这是服务功能: 和控制器功能: 和我的AJAXRequest.php文件 如果我使用 $ http.post() 输出 : 如果我使用 $ http.get(), 我的输出是: 我检查了FireBug工具中的帖子,该帖子将数据发送到我的php文件中。但PHP文件没有参数。 如果我使用