I have been trying to implement the repository pattern in my Angular application. I can see that the JSON data is successfully retrieved over the network when I call my repository, but I am facing issues with binding it to my view.
I have injected the repository into the module, so what could be the issue here?
blogApp.factory('blogEntryRepository', function ($http, $q) {
return {
get: function() {
var deferred = $q.defer();
$http.get('/blogentry').success(deferred.resolve).error(deferred.reject);
return deferred.promise;
}
}
});
blogApp.controller("HomeCtrl", function($scope, blogEntryRepository) {
blogEntryRepository.get().then($scope.blogEntries = blogEntryRepository);
});
<div>
home
<div ng-repeat="blogEntry in blogEntries">
<div>Asdf
{{blogEntry.title}}
</div>
</div>
</div>
On the page, I see the following output:
home
Asdf
{}
Here is the JSON response:
[{"title":"Launched an AngularJS 1.2 site!","date":"2014-05-21T00:00:00"},{"title":"Title2","date":"2014-05-22T00:00:00"}]
The code is enclosed within an ng-app tag and there is an ng-view tag on the page as well.
I have confirmed that I am able to bind to a hardcoded variable successfully.
Using Angular 1.2