How do I stop angularFire limiting number of key/values in an object to 100?

Question

I populate a Firebase object to have 200 key/value pairs, then display it using ng-repeat. The relevant code is:

<ul>
  <li ng-repeat='(n, inst) in db.instances'>Instance {{n}}: {{inst.status}}</li>
</ul>

<script type='text/javascript'>
  angular.module('blah', ['firebase']).controller(
    'BlahCtrl', function BlahCtrl($scope, angularFire) {
      angularFire('https://blahblahblah.firebaseio.com/', $scope, 'db', {});
    }
  )
</script>

Loading the page appears to delete the first 100 key/value pairs.

How do I prevent this behavior?

Answer 1

You can pass in either a url or a Firebase ref instance into angularFire() or angularFireCollection(). So create a Firebase instance first and set the limit() to what you want, then pass it in instead of the direct url.

The docs state that this version of limit() returns a Firebase instance, and a quick test shows it works. You also have to call startAt() first before calling limit().

I got something like this to work:

angular.module('blah', ['firebase']).controller(
  'BlahCtrl', function BlahCtrl($scope, angularFire) {
    var ref = new Firebase('https://blahblahblah.firebaseio.com/').startAt().limit(200);
    angularFire(ref, $scope, 'db', {});
  }
)