$ http然后方法没有设置数组

时间:2016-09-24 06:36:06

标签: angularjs

我在service.js文件中创建了一个服务,我在其中使用$ http来获取帖子列表。以下是 service.js 的代码。

app.service('PostService', function ($http, $log) {
var post =[];
var err = "";

$http({
        method : 'GET',
        url : 'http://myblog.local/wp-json/wp/v2/posts'
    })
    .then(function(response){
        post = response.data;
    }, function(reason){
        err = reason.data.message;
    });

this.getPost = function () {
    return post;
};
this.getError = function () {
    return err;
};});

这是我使用该服务的控制器:

app.controller('BlogController', function($scope, $log, PostService){
    $scope.postModel = PostService.getPost();
    $scope.errorMessage = PostService.getError();
});

每当我调用getPost和getError方法时,它都没有给我任何东西。虽然$ http成功获得了网址的响应。为什么然后方法没有设置变量post和err。

1 个答案:

答案 0 :(得分:1)

您正在使用不正确的呼叫服务器模式。 Http调用是异步操作,因此执行代码需要一些时间来运行getPost()是一个简单的函数,即使值仍然为空,它在您调用它之后返回值。所以你需要做的就是返回Http调用并将其分配给所需的模型,就在它返回值之后。

app.service('PostService', function ($http, $log) {
var post =[];
var err = "";


this.getPost = function () {
   return $http({
        method : 'GET',
        url : 'http://myblog.local/wp-json/wp/v2/posts'
    })
    .then(function(response){
        return response.data;
    }, function(error){
        return error;
    });
};

});


app.controller('BlogController', function($scope, $log, PostService){
    PostService.getPost().then(function(post){
        // here you can put logic to check is post an data or error
        $scope.postModel = post;
    });
});