遍历 Firebase 集合

Question

我有一个存储在 firebase 中的项目集合，项目对象有两个属性，name 和 selected。我已将所有项目打印到视图中，并且每个项目都有一个复选框，可将选中的属性更改为 true。我在底部还有一个按钮，它绑定了一个函数 deleteSelected()。

我的想法是以某种方式遍历 firebase 对象，然后检查它们是否具有 selected=true 的属性，然后删除项目。我尝试在 firebase 对象上使用 $asObject() 函数，但出现此错误。

TypeError: undefined is not a function
 at new <anonymous> (controllers.js:17)
 at invoke (angular.js:3374)
 at Object.instantiate (angular.js:3386)
 at $get (angular.js:5902)
 at angular.js:5400
 at forEach (angular.js:220)
 at nodeLinkFn (angular.js:5387)
 at compositeLinkFn (angular.js:4911)
 at compositeLinkFn (angular.js:4914)
 at publicLinkFn (angular.js:4819)

如何遍历 firebase 对象？还是有更简单的方法来解决这个问题？

如果你想看一下，这里是代码：Plunker

var firebaseRef = new Firebase("https://inkopslista.firebaseio.com/items");
//creates a firebase object that takes a reference to the firebase URL
var items = $firebase(firebaseRef);

$scope.items = items;

这是通过 ng-click 绑定到按钮的函数。

$scope.deleteSelected = function(){

    for(var i=0; i < items.length; i++){

        if(items[i].selected === true){
            console.log(items[i]);
        }
    }
};

Answer 1

如果您的 Firebase 中有类似数组的结构，您应该调用 $asArray 而不是 $asObject。 AngularFire 的 FirebaseArray class（这就是 $asArray returns）在幕后做了很多工作以确保 Firebase 的有序集合很好地映射到 JavaScript 数组（这是 AngularJS 所期望的）。

从你的plunker修改：

var firebaseRef = new Firebase("https://your.firebaseio.com/items");

//creates a firebase object that takes a reference to the firebase URL
var items = $firebase(firebaseRef);

$scope.items = items.$asArray();

$scope.items.$loaded().then(function(array) {
    console.log('Initial items received from Firebase', array.length);
});

另见：Unable to get length of Firebase Objects

更新

您似乎使用的是非常旧的 Firebase 和 AngularFire 版本。类似数组结构的处理在 0.8 版中得到了显着改进。如果您不升级，您最终将重现最近版本中引入的大量代码。

为了给你一些想法，我很快将你的控制器和视图放入 jsbin 中，并使其与最新版本的 AngularJS、Firebase 和 AngularFire 一起工作。

.controller("MainController", ["$scope", "$firebase", "$filter" , function($scope, $firebase, $filter){
    var firebaseRef = new Firebase("https://inkopslista.firebaseio.com/items");
    var items = $firebase(firebaseRef);
    $scope.items = items.$asArray();

    $scope.addItem = function(item){
        if(item === undefined){
            return null;
        }else{
            item.selected = false;
            $scope.items.$add(item);
        }    
        $scope.newItem = null;
    };


    $scope.deleteItem = function(id){
        $scope.items.$remove(id);
    };

    $scope.deleteSelected = function(){
        $scope.items.forEach(function(item) {
            if (item.selected) {
                $scope.items.$remove(item);
            }
        });
    };
}]);

jsbin：http://jsbin.com/varoka/1/edit?html,js,output

遍历 Firebase 集合

Iterating through a firebase collection

angularjs

firebase

angularfire

更新