11

I have a list of objects from Firebase using the angularFire implicit data sync, and I'd like to render their unique ids (for use in urls) along with the other data properties using ng-repeat. Can I make angularFire return in such a way that I have access to the object ids within ng-repeat, the same way that members of an angularFireCollection have an $id property? If not, what is the right way to accomplish this? Hypothetical code (that doesn't work):

Controller:

myApp.controller('ItemListCtrl', ['$scope', 'angularFire',
  function ItemListCtrl($scope, angularFire) {
    var ref = new Firebase(firebaseUrl);
    angularFire(ref, $scope, 'items');
  }
]);

View:

<div ng-repeat="item in items" >
  <a href="" ng-href="#/items/{{item.name()}}">{{item.text}}</a>
</div>
hiattp
  • 2,326
  • 1
  • 20
  • 23

2 Answers2

24

I think all you need is:

<div ng-repeat="(name, item) in items">
  <a href="" ng-href="#/items/{{name}}">{{item.text}}</a>
</div>

The anglularFire object behaves just like a normal javascript object.

bennlich
  • 1,207
  • 10
  • 21
7

To get the unique ID that is created via the angularfire $add method, you can use the $id property:

<div ng-repeat="item in items" >
  <a href="" ng-href="#/items/{{item.$id}}">{{item.text}}</a>
</div>
swickblade
  • 4,506
  • 5
  • 21
  • 24