帶有$ http.get的AngularJS服務不會將數據傳遞給控制器

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

控制台僅打印一個空Array []。 如果我將console.log（data）放在成功承諾中，console.log會很好地打印數組。 我認為從代碼學校開始可能會更容易，但是我想我缺少將數據從成功承諾傳遞到控制器的要點。 在許多其他情況下，我可以看到$ scope變量的用法，但是我了解到，如果我使用“ this”，也可以避免使用該變量。 這就是我的代碼，不顯示任何$ scope。

我正在使用Angular 1.4.1 FYI，我看到了很多論壇和其他問題，但情況似乎有所不同。

謝謝

Answer 1

您在解決諾言之前正在訪問變量。 您可以做的是返回一個具有各種諾言作為屬性的對象。

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

希望能幫助到你。