I have a json-file defined and I am trying to load in one of my controllers. I am using a factory to fetch the data:
.factory('myService', function($http) {
var all_data = [];
return {
getAllData: function(){
return $http.get('js/data/all_data.json').then(function(data) {
all_data = data;
return all_data ;
});
}
}
})
Later in my controller I call getAllData() in a loadData()-function:
.controller(‘QuizCtrl’,[’$scope’,’$state’,’$http’,‘myService’,function($scope,$state,$http,myService){
// $scope.myData = []; <-- this makes the app freeze and not respond anymore
$scope.loadData = function(){
myService.getAllData().then(function(all_data){
$scope.myData = all_data.data.all_data;
alert($scope.myData);
});
}
$scope.loadData();
$scope.another_var = $scope.myData;
}])
As you can see first of all I am also calling loadData(). While debugging inside the function (see alert()) I can clearly see how the json has been loaded and applied to the $scope.myData variable.
Once I try to assign the variable to another variable (see $scope.another_var) myData is ‘undefined’.
What I tried was defining $scope.myData before the $scope.loadData() call (see comment in code). Unfortunately this simple variable declaration makes my app freeze completely. I have not found the reason for this yet. Also I am not sure if it is related to my overall problem.
I also tried to use $q but it did not change anything, afaik http.get already returns a promise.
So what have I missed? Why am I not able to store my “http get” result in my controller’s $scope?