Firebase angular many to many relation query - angularjs

Question

I have a fairly simple json structure of groups and people and I am struggling to get/read a list of the group names for each person from firebase. This is what I tried. I spent a couple of days debugging unsuccessfully. Help much appreciated.
JSON:
{
"groups" : {
"one" : {
"members" : {
"-KLxjv9OnQB2l5Ohr-7I" : true
},
"name" : "group alpha"
},
"two" : {
"members" : {
"-KM4oXjftRZZ5DXYt4B2" : true
},
"name" : "group beta"
},
"three" : {
"members" : {
"-KM4oXjftRZZ5DXYt4B2" : true
},
"name" : "group gamma"
}
},
"persons" : {
"-KLxjv9OnQB2l5Ohr-7I" : {
"groups" : {
"one" : true
},
"personName" : "name1",
"personTitle" : "title1"
},
"-KM4oXjftRZZ5DXYt4B2" : {
"groups" : {
"two" : true
},
"personName" : "name2",
"personTitle" : "title2"
}
}
}
APP.JS:
$scope.personsGroup = function(personObj){
var baseRef = new Firebase("https://un-cms-13264.firebaseio.com/");
var personsRef = baseRef.child('persons');
var groupsRef = baseRef.child('groups');
var res=[];
for(var i=0;i<Object.keys(personObj.groups).length;i++){
var groupKey=Object.keys(personObj.groups)[i]
res.push($firebaseArray(groupsRef.child(groupKey)));
};
return res;
}
HTML:
<div class="row" ng-repeat="person in persons">
<div class="col-lg-3"></div>
<div class="col-lg-3">{{person.personName}}</div>
<div class="col-lg-3"></div>
<div class="col-lg-3 groupsList">
<ul><li ng-repeat="group in personsGroup(person)">{{group.name}}</li></ul>
</div>
</div>

Answer 1

The best way would be to attach $firebaseArray to a $scope variable:
var ref = new Firebase("https://un-cms-13264.firebaseio.com/").child("persons").child(some-person).child("groups");
$scope.personsGroup = $firebaseArray(ref);
// When loaded
$scope.personsGroup.$loaded(function(data) {
// can do something
}, function(error) {
// error
});
How you determine some-person is up to you. You could query the persons tree and store all the persons or store it inside an array or object.
<ul>
<li ng-repeat="(key, value) in personsGroup">{{ key }}</li>
</ul>
I would not advise personGroup(person) because $firebaseArray is an asynchronous call and I feel like it could be real jumpy. Be smart with it, you could also just get the entire persons tree in one call if you wanted:
var ref = new Firebase("https://un-cms-13264.firebaseio.com/").child("persons");
$scope.persons = $firebaseArray(ref);
And do some iterating of that.