Question

我在一个控制器中有这些功能。我已成功导入数据，但无法使用$add，$remove和$edit。我使用$RootScope因为保存的项目处于不同的状态，因此控制器不同。我是新人，所以我非常感谢你的帮助。

angular
    .module("")
    .factory("Factory",function($http,$firebaseArray){

        var ref = new Firebase('https://****.firebaseio.com/');

                return{
                ref:$firebaseArray(ref)
        }
    });

           $scope.saveItems = function() {
            console.log($scope.item);
            $rootScope.items.push($scope.item);

            $scope.item = [];
            $mdSidenav('right').close();
        }

        $rootScope.removeItems = function(item) { 
        var  index = $rootScope.items.indexOf(item);
        $rootScope.items.splice(index, 1);     
        };

            $rootScope.editItems=function(item){
            $rootScope.editing = true;
            $mdSidenav('right').open();
            $rootScope.item=item;

             $rootScope.saveEdit=function(){
              $rootScope.editing=false;

                $mdSidenav('right').close();
            };
        };

Answer 1

Firebase中的数组可能有点棘手。来自Firebase博客的a good post可以了解一些细节。但最重要的是要理解的是，Arrays实际上存储为对象（可以使索引访问变得棘手）并且多个客户端可能同时更新数组，这可能会导致意外结果。

在您的情况下，我认为考虑通过您的应用程序的数据流是有帮助的。 $ firebaseArray的优点在于，无论何时在Firebase上更新该阵列，都会将更改广播到所有连接的客户端。

在您的应用程序中，不是在$ rootScope上更新某些内容以查看视图中反映的更改，而是更新Firebase上的数据并让$ firebaseArray广播更改。使用Firebase阵列提供的方法，您实际上可以直接在视图中执行此操作（请参阅下面的HTML部分）。

// JavaScript
var app = angular.module("ItemApp", ["firebase"]);

app.controller("ItemCtrl", function($scope, $firebaseArray) {
    var itemsRef = new Firebase("https://xxxx.firebaseio.com/items");
    $scope.items = $firebaseArray(itemsRef);
  }
]);

在视图中：

//HTML example with remove only, can apply to add or edit
<ul>
  <li ng-repeat="item in items">
    {{ item.property }}
    <button ng-click="items.$remove(item)">x</button>
  </li>
</ul>

这里的重大变化是不考虑在客户端更新数据，然后尝试将其同步回Firebase，而是更新Firebase上的数据，然后让$ firebaseArray同步更改客户端。

docs on synchronized arrays在上面概述的基本CRUD操作方面有很好的细节。

如何在数组中添加，删除和编辑新对象，从AngularJS到Firebase

1 个答案: