AngularJS 具有 $http.get 的服务不会将数据传递给控制器

Question

我是 AngularJS 的新手，仍然停留在基础知识上。

我正在创建一个带有 $http.get 的服务来加载几个 Json 文件。当我将服务加载到控制器中时，我得到空数组。

这是我的服务

app.service('productService', ['$http', function($http){
    var lista = this;
    lista.products = [];
    lista.menu = [];

    $http.get('/prodotti_1.json').success(function(data){
        lista.products = data;
    });

    $http.get('/menu_1.json').success(function(data){
        lista.menu = data;
    });
}]);

这是我的控制器：

app.controller('ProductController', ['productService', function(productService){
    console.log(productService.products);
    console.log(productService.menu);
}]);

控制台只打印一个空数组 [ ]。如果我将 console.log(data) 放入成功承诺中，console.log 会很好地打印数组。我认为从 codeschool 可以更容易，但我想我错过了将成功承诺中的数据传递给控制器的要点。在许多其他情况下，我看到了 $scope 变量的用法，但我了解到如果我使用 "this" 也可以避免使用。所以那是我的代码不显示任何 $scope.

我正在使用 Angular 1.4.1 仅供参考，我看到了很多论坛和其他问题，但情况似乎有所不同。

谢谢

Answer 1

您正在访问承诺解决之前的变量。你能做的是 return 一个对象，它有你的各种承诺，如属性。

app.service('productService', ['$http', function($http){
    return {
         request1: $http.get('/prodotti_1.json'),
         request2: $http.get('/menu_1.json')
       }
}]);

所以你可以在你的控制器中处理它。

app.controller('ProductController', ['productService', function(productService){
    productService.request1.success(function(data){
        //access the data
    });

    productService.request2.success(function(data){
        //access the data
    });
}]);

希望对您有所帮助。

AngularJS 具有 $http.get 的服务不会将数据传递给控制器

AngularJS service with $http.get doesn't pass data to a controller

javascript

service

json

controller

angularjs