How to retrieve Geofire's data into Ion-List ?

[frenchynyc]

Hello,

Geofire seems to be exactly what I am looking for for my Ionic app and I am using its Javascript library to go further.

Now I am having quite a headache for days in order to retrieve the information I need to display based on location.

I retrieve the users that are nearby like this :

//Retrieve businesses around
    var userId = firebase.auth().currentUser.uid;
    var database = firebase.database().ref('/accounts/' + userId);
    database.on('value', function(snapshot) {
      var lat = snapshot.val().lat;
      var long = snapshot.val().long;
      var rootRef = firebase.database().ref();
      var geoFireRef = rootRef.child("geolocation");
      var restaurantsRef = rootRef.child("accounts");
      var geoFire = new GeoFire(geoFireRef);

      var geoQuery = geoFire.query({
      center: [15, 2],
      radius: 2
    });
    var matches = [];
    // Listen to every restaurant in our query...
    geoQuery.on("key_entered", function(key) {
      // ... and look them up by key ...
      restaurantsRef.child(key).on("value", function(snapshot) {
        var restaurant = snapshot.val();
        console.log(restaurant);

      });
    });
  })

Now, I would like to be able to display these information like this in my HTML :

<ion-list class="item-border-off list-fav">
          <a  ><ion-item ng-click="toUserView($index)" ng-repeat="user in users" class="item-remove-animate item-avatar">
                      <img ng-src="{{user.photoURL}}">
                      <h2 id={{user.uid}}>
                          {{user.name}}
                      </h2>
                      <p >{{user.description}}</p>
                      <p style="color:white;" id="userUID{{$index}}">{{user.uid}}</p>
                      <!-- button options -->
                      <ion-option-button>
                          <i class="icon ion-ios-trash-outline"></i>
                      </ion-option-button>
                      <ion-option-button>
                          <i class="icon ion-ios-chatbubble-outline"></i>
                      </ion-option-button>
                  </ion-item></a>
                  <div ng-if="items !== undefined && !items.length" class="no-results">
      <p>No Results</p>
    </div>
          </ion-list>

However, I don't find a way to do so. What would be the code to put in my controller in order for it to be displayed like this since Geofire returns objects one by one and not all of them at the same time ?

Thank you for your help !

[jwngr]

This is a usage question, which is better suited for Stack Overflow or the Firebase Google Group. Can you please re-post on one of those forums and paste the link here? Please also remember to include version information and a code sample (if relevant) to help us resolve your issue.

[frenchynyc]

Hello, I have posted several times on StackOverflow and the Google group, at least 5 or 6 times for the last 3 weeks and I never even have an answer... I'll just migrate to another library, I get zero support from Google/Firebase whatsoever. Regards

[jwngr]

Please provide a link to the Stack Overflow and Google Groups post and I'll take a look and see if I can help.

[jwngr]

We also have personalized support here.

[frenchynyc]

Thank you, I took the time to post it here once again, if a charitable soul would like to help, I would gladly appreciate it : http://stackoverflow.com/questions/42743252/how-to-pass-my-results-to-an-array

[jwngr]

That Stack Overflow page doesn't seem to exist.

[jwngr]

I found your question on the Google Group here and did my best to answer it. Hope that helps!