Recently, I've encountered some issues with synchronized arrays in AngularJS using AngularFire. My setup includes angularfire 1.1.3 and firebase 2.3.1. I initialized the query like this:
var arr = $firebaseArray(ref.limitToFirst(5));
Initially, when I called
arr.$remove(0)
The next object from the query would automatically load into the synchronized array. This created a sliding window effect over the response data, always maintaining the same number of elements.
However, recently, I have noticed a change in behavior leading to two different scenarios:
1: The arr
is loaded with 5 items, but after removing each item using arr.$remove
five times, the array becomes empty - which is normal for JavaScript arrays, but not what I had experienced before with AngularFire synced arrays.
2: At other times, arr
initially loads with items, but then inexplicably disappears as shown in the code:
arr.$loaded(function(){
\\ break
})
During debugging inside the callback function, arr
contains the expected five items corresponding to Firebase data, but at the end of the Angular digest loop, arr
turns into an empty array.
Demo: This plunker demonstrates scenario 1
My queries are as follows:
- Was I relying on undocumented API behavior?
- Has there been a recent change in behavior?
- What could explain the discrepancy between having items on
$loaded
and ending up with an empty array?
Update
It appears that scenario 2 occurs after scenario 1 - specifically, after encountering an empty synchronized array, a page reload results in a non-empty array during arr.$loaded
callback but ends up empty thereafter.
Could this suggest some issue with firebase itself getting stuck?
I will attempt to replicate this behavior in the provided plunker.