Just getting started with AngularJS and I'm running into some challenges with the basics.
I've been working on a service that uses $http.get to load a couple of Json files. However, when I try to use the service in my controller, I end up with empty arrays.
This is what my service looks like:
app.service('productService', ['$http', function($http){
var dataList = this;
dataList.products = [];
dataList.menu = [];
$http.get('/prodotti_1.json').success(function(data){
dataList.products = data;
});
$http.get('/menu_1.json').success(function(data){
dataList.menu = data;
});
}]);
And here's my controller:
app.controller('ProductController', ['productService', function(productService){
console.log(productService.products);
console.log(productService.menu);
}]);
When I check the console, all I see is an empty Array [ ]. If I add console.log(data) inside the success promise, it displays the array correctly. I was under the impression that using "this" instead of $scope would suffice, but it seems like there's something missing in passing the data from the success promise to the controller. I've researched various forums and questions, but haven't found a similar scenario.
For reference, I'm working with Angular 1.4.1. Any insights or guidance would be greatly appreciated.
Thank you