$firebaseArray data not yet available on $loaded.then() on 1.1.1

[cm-jdrelick]

The following code will not work in AngularFire 1.1.1:

$scope.numbers = $firebaseArray($fbRef.child('numbers'));    
$scope.numbers.$loaded().then(function() {
  $scope.numbers.$keyAt(0); // does not work
  $scope.numbers.$keyAt(1); // does not work
  console.log($scope.numbers); // logs FB array with multiple elements, as expected
});

$getRecord() and $indexFor() do not work either. When I rollback to 1.0.0, I can access by $scope.numbers[0] etc., which is working for me for now.

[cm-jdrelick]

I should mention that the following doesn't work either:

$scope.numbers = $firebaseArray($fbRef.child('numbers'));    
$scope.numbers.$loaded().then(function(data) {
    data.$keyAt(0); // does not work
    data.$keyAt(1); // does not work
});

[katowulf]

What version of the Firebase SDK and Angular are we working with here?

[cm-jdrelick]

Angular: 1.2.x Firebase: Latest (2.2.5)

[jwngr]

Just to humor us, can you try using the latest Angular 1.3.x and see if your problem persists?

[katowulf]

I was unable to repro this in 1.3.3 using this code:

    var app = angular.module('app', ['firebase']);

    app.controller('ctrl', DefaultController);

    function DefaultController($scope, $firebaseArray, $firebaseObject, $firebaseAuth) {
      var fb = new Firebase('https://kato-sandbox.firebaseio.com/books');
        $scope.list = $firebaseArray(fb);
        $scope.list.$loaded().then(function() {
          console.log('keyAt', $scope.list.$keyAt(0));
          console.log($scope.list.length);
        });
    }

The output:

keyAt book1
3

[cm-jdrelick]

That seems to do the trick!! Apparently Angular 1.2 is the problem, it works on 1.3.15 :) Thanks much for your help!

[katowulf]

Glad to help. Thanks for submitting an issue.

[dreadjr]

I am experiencing an issue when i extend a firebaseArray, if use directly, it works as expected. Tried to make into small application below.

related items: [#596] plunkr: http://plnkr.co/edit/jFpxUk

firebase@2.2.7
angular@1.3.16
angularfire@1.1.1

// declare a module
var myAppModule = angular.module('myApp', ['firebase']);

myAppModule.controller('GreetingController', ['$scope', '$firebaseArray', '$q', function($scope, $firebaseArray, $q) {
  var url = "https://todomvc-angular.firebaseio.com/todos";
  var TestExtendArray = $firebaseArray.$extend({
        $$added: function (snap, prevChild) {
            var self = this;

            return $q(function(resolve, reject) {
                var record = $firebaseArray.prototype.$$added.call(self, snap, prevChild);
                resolve(record);
            });
        }
    });

  // THIS DOESN'T WORK
    $scope.list = TestExtendArray(new Firebase(url).limitToFirst(100));
    $scope.list.$loaded().then(function() {
        console.log('keyAt', $scope.list.$keyAt(0));
        console.log('$$ilst', $scope.list.length);
    });

    // THIS WORKS
//  $scope.list = $firebaseArray(new Firebase(url).limitToFirst(100));
//  $scope.list.$loaded().then(function() {
//      console.log('keyAt_1', $scope.list.$keyAt(0));
//      console.log('$$ilst_1', $scope.list.length);
//  });
}]);

When i extend the array the loaded() appears to fire before the data is actually loaded. Maybe i am just doing something wrong. Any ideas?

[katowulf]

@dreadjr please submit a new issue as this one has already been resolved. Make sure, as with the original issue, that yours is not also a result of using 1.2.x of Angular.

[dreadjr]

sorry didn't noticed this was closed. Created a new issue #629