Firebase AngularFire nested collections
I have data of the form
{
"events" : {
"-J2MoqWZnkcRCSugBfj3" : {
"title" : "Some other event",
"ratings" : {
"-J2N4QYSk4y2BYznkGvk" : {
"value" : 0
},
"-J2N3rfUPlPNP45RUZYx" : {
"value" : 0
}
}
},
"-J2MpSSN8oldDqd-0jrr" : {
"title" : "New event"
}
}
}
The events collection has a nested collection called ratings. I wish to
manage both the collections through angularFireCollection, but I am not
sure how do I get around to do it.
My Angular controller and template are defined as:
APP.controller('EventsCtrl', function ($scope, angularFireCollection) {
$scope.events = angularFireCollection(<reference to events collection>);
});
<ul class="list-group">
<li class="list-group-item" ng-controller="IndividualEventCtrl"
ng-repeat="event in events">
<div><strong class="lead">{{event.title}}</strong></div>
<div ng-include="event.template"></div>
<rating value="rate" max="max" readonly="isReadonly"></rating>
</li>
</ul>
Controller for each event:
APP.controller('IndividualEventCtrl', function ($scope, FirebaseService,
angularFireCollection) {
$scope.max = 5;
$scope.rate = 0;
$scope.isReadonly = false;
var ratingsRef =
FirebaseService.events().child($scope.event.$id).child("ratings");
$scope.rating = ratingsRef.push({value:0});
});
The last two lines where I create the ratingsRef and add a new rating to
the collection cause my controller to go in some sort of an infinite loop.
I'd really like to know what is the best way to manage nested collections
so that I can add/update the elements in those collections.
Thanks.
No comments:
Post a Comment