如何访问$ FirebaseArray中的各个元素而不等待它加载？

Question

我使用AngularFire从Firebase请求一些数据，如下所示。

$rootScope.userTags = $firebase($fbCurrent.child('tags')).$asArray();

按以下方式记录此数据时，我会得到如下图所示的输出。所以，

console.log($rootScope.userTags);
console.log($rootScope.userTags[0]);
$rootScope.userTags.$loaded().then(function () {
  console.log($rootScope.userTags[0]);
});

在第一个日志语句中，您可以注意到一个包含五个元素的$FirebaseArray对象。在第二个日志语句中，当我尝试访问其中一个元素时，我得到undefined，尽管您可以在un $loaded数组中清楚地看到这些元素。现在，在最后一个日志语句中，调用$loaded可以让我访问这些元素而不会出现任何问题。

为什么它会这样？有没有办法可以访问这些元素，因为那些元素已经存在，而没有在数组上调用$loaded？

Answer 1

$asArray()或$asObject()方法是异步操作。必须先从Firebase下载数据，然后才能访问它。这只是异步数据的本质，而不是Firebase特有的任何内容。

我们处理这个异步问题的方式是通过$loaded承诺。

这似乎是确保数据在实例化控制器时加载的真正问题。你可以解决这个问题，解决路由器中的数据问题。

Resolve需要退回承诺。当用户路由到该页面时，Angular将不会加载页面，直到解析了promise。从promise中解析的数据将注入控制器。

.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider

      .when('/resolve', {
        templateUrl: 'resolve.html',
        controller: 'ResolveCtrl',

        resolve: {
          // data will be injected into the ResolveCtrl
          data: function($firebase) {
           // resolve requires us to return a promise
           return $firebase(new Firebase('your-firebase')).$asArray().$loaded();
          }
        }

      })
  }
])

现在我们正在解析路线中的数据，我们可以在控制器中访问它。

.controller('ResolveCtrl', function($scope, data) {

  $scope.userTags = data;
  $scope.userTags[0]; // data has been resolved from the promise

});