香草火腿

我会这样做的艰难的方法,因为我认为这里有很大的价值理解这里的基本原则.这是相当复杂的,我只会涵盖必需品.还有很多小边缘的案件也被处理：

angular.module('app',[])
    .controller('UsersController',$firebase,$timeout,$routeParams){
      var userId = $routeParams.userId;
      $scope.user = $firebase(new Firebase('URL/user/'+userId));

      // or,for 3-way binding and automatic writes back to Firebase
      var userRef = $firebase(new Firebase('URL/users/'+userId)).$bind($scope. 'user');

      // grab this users' books using Firebase (the hard way)
      $scope.books = {};
      var booksRef = new Firebase('URL/books/');

      // fetch the user's book list dynamically because it may change in real-time
      var indexRef = new Firebase('URL/user/'+userId+'/books');

      // watch the index for add events
      indexRef.on('child_added',function(indexSnap) {
         // fetch the book and put it into our list
         var bookId = indexSnap.name();
         booksRef.child(bookId).on('value',function(bookSnap) {
            // trigger $digest/$apply so Angular syncs the DOM
            $timeout(function() {
               if( snap.val() === null ) {
                  // the book was deleted
                  delete $scope.books[bookId];
               }
               else {
                  $scope.books[bookId] = snap.val();
               }
            });
         });
      });

      // watch the index for remove events
      indexRef.on('child_removed',function(snap) {
         // trigger $digest/$apply so Angular updates the DOM
         $timeout(function(snap) {
            delete $scope.books[snap.name()];
         });
      });
});

然后HTML(下面的其他例子将是一样的)：

<div data-ng-repeat="(bookId,book) in books">
   {{bookId}}: {{book.title}}
</div>

这里的一些边缘案例没有完全涵盖：

>数据不按优先级排序排序
>当从索引中删除记录时,应该在数据路径上调用off()
>索引排序的变化不会改变数据记录的顺序
>索引的值不存储在任何地方以供参考(如果重要)

FirebaseIndex

FirebaseIndex是一个简单的实用程序,它采用像您的书籍列表这样的索引,并以更复杂的方式管理我们刚才创建的代码.

不幸的是,FirebaseIndex不支持值事件,所以它不能与0.5之后的angularFire一起使用,因为对angularFire的内部加载机制有所改变.所以它不像以前那么简短和甜蜜.

angular.module('app',[])
.controller('UsersController',$timeout){
   var userId = $routeParams.userId;
   $scope.user = $firebase(new Firebase('URL/user/'+userId));

   var fb = new Firebase(URL);
   var index = new FirebaseIndex( fb.child('user/'+userId+'/books') );
   $scope.books = {};

   // almost magic
   index.on('child_added',function(snap) {
      $timeout(function() { $scope.books[snap.name()] = snap.val(); });
   });

   index.on('child_removed',function(snap) {
      $timeout(function() { delete $scope.books[snap.name()]; });
   });
});

Firebase.util.join

Firebase-util是一个功能更强大和更复杂的库,用于规范化路径.因为它返回一个像普通Firebase参考一样工作的对象,它也可以与angularFire 0.5及以上版本无缝地使用.

angular.module('app',$firebase){
   var userId = $routeParams.userId;
   $scope.user = $firebase(new Firebase('URL/user/'+userId)); 

   var fb = new Firebase(URL);
   var ref = new Firebase.util.intersection( fb.child('user/'+userId+'/books'),fb.child('books') );

   // magic!
   $scope.books = $firebase(ref);
});