Firebase 绑定未反映在角度视图中

我从 Firebase 中的每个对象 picUrl（图片的 url）中提取一个值，并将其存储在作用域数组变量 $scope.bricks 中。如何使 $scope.bricks 每次使用新对象更新 Firebase 时更新，从而更新新的 picUrl？提前致谢！

angular.module('noorApp').controller('MainCtrl', function ($scope, $http, $firebase) {
    var sync = $firebase(ref);
    var firebaseObj = sync.$asObject();
    $scope.bricks = [];

    firebaseObj.$loaded().then(function(){
        angular.forEach(firebaseObj.products, function(value, key){
            $scope.bricks.push({src: value.picUrl});
        });
    });
});

EDIT:

我应该发布我如何在 DOM 中使用 $scope.bricks 。

<div class="masonry-brick" ng-repeat="brick in bricks">
  <img ng-src="{{ brick.src }}">
</div>

问题是，虽然 firebaseObj 与 Firebase 同步，但 $loaded() 仅运行一次。
谢谢。

正如我在评论中所说，您可能可以通过以下方式使其正常工作：

    firebaseObj.$loaded().then(function(){
        angular.forEach(firebaseObj.products, function(value, key){
            $scope.bricks.push({src: value.picUrl});
            $scopy.$apply();
        });
    });

更新：以上不起作用，请参阅下面OP的评论。

要了解更多信息$scope.$apply阅读这篇文章：http://jimhoskins.com/2012/12/17/angularjs-and-apply.html

但即使这可能会解决您当前的问题，但稍后您还会遇到其他问题。原因是您正在创建一个“非托管数组”。 AngularFire 有相当多的代码来确保 Firebase 的订单集合和 AngularJS 的双向数据绑定数组能够很好地协同工作。

因此，如果您为一系列产品设置单独的同步可能会更好：

angular.module('noorApp').controller('MainCtrl', function ($scope, $http, $firebase) {
    var sync = $firebase(ref);
    var firebaseObj = sync.$asObject();
    $scope.bricks = $firebase(ref.child('products')).$asArray();    
});

通过此设置，AngularFire 将调用$apply()当数组项最初加载或之后修改时自动执行。