How to display data in firebase using angularfire collection?

Question

I have some data in firebase in the url "https://wpladv.firebaseio.com/adventure" and I have the following code in my js file:

.factory('dataUpdate', ['angularFireCollection', function(angularFireCollection) {
  var dbUrl = 'https://wpladv.firebaseio.com/adventure';
  return {
    adventures: function(){
      var cat = '/adventure';
      return angularFireCollection(dbUrl + cat);
    }
  }
}])

I also have the following code in my HTML

<ul class="unstyled">
  <li ng-repeat="adventure in adventures">
    <div class="well">
      <h4>{{adventure.name}}</h4>
      <h5><em>{{adventure.desc}}</em></h5>
      <p>{{adventure.theme}}</p>
      <p>{{adventure.like}}%</p>
      <p>Taken by {{adventure.used}}</p>
   </div>
  </li>
</ul>

The data in firebase is in JSON. My question is how do i display the data in the url using angularfire collection object? I am new to angularfire and any suggestion will be appreciated. Thanks in advance.

Arnaud Rinquin Arnaud Rinquin · Accepted Answer · 2013-09-17T19:41:55

First, please do this really simple tutorial. It'll help you understand the basics of angular and firebase.

You have to bind the firebase data to the target scope. This is usually done in the controller (see this specific step of the tutorial)

How to display data in firebase using angularfire collection?

1 Answers