I am using Geo Fire with Angular JS in Ionic Framework here is my Geo Fire Code looks like
geoQuery = geoFire.query({
center: [location.lat, location.lng],
radius: 5
});
geoQuery.on("key_entered", function(key, location, distance){//something here})
Here I am getting all matched information what I needed by these three variables respectively key, location & distance. In this situation my query matched 3 information from firebase. Now I want to display the information into a Ionic List using ng-repeat. For that I am using the following code to save these information into an array.
var hello = geoQuery.on("key_entered", function(key, location, distance) {
var names = [];
names.push(key);
distance = distance.toFixed(2);
var distances = [];
distances.push(distance);
});
But my list is only showing the last value from the information. Here I took a screenshot of my console. Here we can see these 3 values of distances which matched my query.
But list is showing only the last value.
Let's analyze your code to see if we can explain the behavior you see:
var hello = geoQuery.on("key_entered", function(key, location, distance) {
var names = [];
names.push(key);
distance = distance.toFixed(2);
var distances = [];
distances.push(distance);
});
Every time a key enters the region identified by the query, the callback function is executed. In that function you create two arrays and add the key and the distance to them. So for each key you create two new arrays, probably not what you had in mind.
Try it like this:
var names = [];
var distances = [];
var hello = geoQuery.on("key_entered", function(key, location, distance) {
names.push(key);
distance = distance.toFixed(2);
distances.push(distance);
});
Now every time a key enters the region, you add the key and the distance to existing arrays. So over time, you will get a lot of keys and distances in that array.
Keep in mind that you also should remove the keys+distances from their arrays, when the key_exited
event fires.