Recently, I started learning AngularJS and have been struggling to fetch JSON data from a factory. The error message I keep getting is not very helpful:
TypeError: Cannot read property '1' of null
This is the module I am working with:
var app = angular.module('app', ['ngRoute']);
Below is my Controller code:
app.controller('homePageController', function ($scope, projectsFactory) {
$scope.projects = projectsFactory.getList();
});
This is how I defined my Factory:
app.factory('projectsFactory', function($http, $q) {
return {
getList: function() {
var deferred = $q.defer();
$http.get('Resources/JSON/projects.json').success(function(data){
deferred.resolve(data);
}).error(function(){
deferred.reject();
});
return deferred.promise;
},
};
});
Here is part of the HTML page:
<ul ng-controller="homePageController">
<li ng-repeat="project in projects">
{{projects.name}}
</li>
</ul>
And here is an excerpt from the JSON file:
[
{
"Id": 1,
"name": "Colombo Law",
"snippet": "Colombo Law snippet"
},
{
"Id": 2,
"name": "Lunch?",
"snippet": "What for lunch snippet"
}
]
This is the detailed error message I am seeing:
TypeError: Cannot read property '1' of null
at $get (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js:6839:28)
at link (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-route.js:907:26)
at nodeLinkFn (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js:6271:13)
at compositeLinkFn (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js:5682:15)
at publicLinkFn (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js:5587:30)
at boundTranscludeFn (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js:5701:21)
at controllersBoundTransclude (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js:6292:18)
at update (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-route.js:865:25)
at Scope.$get.Scope.$broadcast (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js:12329:28)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-route.js:556:26 <div ng-view="" class="ng-scope">
If anyone can provide guidance or assistance with this issue, it would be greatly appreciated!