Can You Append / Prepend to an Already Synced Array?
pihish opened this issue · comments
I have a chat application that runs off of Firebase / AngularFire. When an user clicks on a chat conversation, I run the following to get the last 50 messages between the user and the person he / she is having a conversation with:
var sync = $firebase(ref.orderByChild('timestamp').limitToLast(50));
$scope.sms = sync.$asArray();
The object that houses the conversation between two specific users can have thousands of messages inside of it (each message is a property of that object). If I try to load the entire object, there is massive lag in the browser.
I could lazy fetch older messages as the user scrolls up in his or her chat window by incrementally increasing the number of messages to show if I re-sync my object by calling the following code:
var sync = $firebase(ref.orderByChild('timestamp').limitToLast(messagesToShow));
messagesToShow = messagesToShow + 50;
$scope.sms = sync.$asArray();
But since the DOM elements which represent individual messages are synced to $scope.sms
, those elements would disappear temporarily when I re-sync $scope.sms
.
Is there anyway to prepend to $scope.sms
using something like the limitToLast()
method so that I can add more messages to the $scope.sms
array without having its existing values erased?
Something akin to unshift()
in vanilla JavaScript?
Version info
Angular: 1.5.5
Firebase: 2.2.3
AngularFire: 0.9.2
Cross-post: http://stackoverflow.com/questions/43532382/firebase-can-you-append-prepend-to-an-already-synced-array Please indicate when you cross-post, to reduce the chances of somebody spending time when you've already been helped elsewhere.