如何使用以下代码在Firebase中同步

Question

如何在Firebase中绑定这些代码并进行自动同步，我想检查参加的受邀者

var guestApp = angular.module("guestApp", []);
guestApp.controller('guestCtrl', function($scope) {
    $scope.guests = ['jean','elie','tierry'];
   
  $scope.addGuest = function(){
  $scope.guests.push($scope.newGuest);
  $scope.newGuest = '';
 };
 
 $scope.removeGuest = function(guest){
 var i = $scope.guests.indexOf(guest);
 $scope.guests.splice(i,1);
 };

Answer 1

首先，您需要确保将这些库包含在HTML中：

<!-- AngularJS -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>    
<!-- Firebase -->
<script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
<!-- AngularFire -->
<script src="https://cdn.firebase.com/libs/angularfire/1.1.1/angularfire.min.js"></script>

至于代码本身：

1. 您需要添加 Firebase 模块依赖项：

   var guestApp = angular.module("guestApp", ["firebase"]);
   

2. 然后，您需要在控制器中注入适当的 Firebase 服务并进行日志身份验证：

   guestApp.controller('guestCtrl', function($scope, $firebaseArray) {
       var ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/guests");
   

3. 之后，您可以将范围变量绑定到您的 Firebase 参考：

       $scope.guests = $firebaseArray(ref);
   

4. 至于添加新项目：

     $scope.addGuest = function(){
         $scope.guests.$add($scope.newGuest);
         $scope.newGuest = '';
     };
   

5. 并删除：

    $scope.removeGuest = $scope.guests.$remove;
   

我想就是这样。 顺便说一句，您可以在官方文档中阅读所有相关信息;)https://www.firebase.com/docs/web/libraries/angular/quickstart.html