So I spent way to much time reading websites stackover flow and bug reports for this issue. I have some buttons that get there value.bind="$this.queue[0]" etc. Problem was that when the array was updated with direct indexing it would not update browser/dom ie: queue[0]=“fred” didn’t update the binding.
So after much reading I read that you should use splice(i,1,data) so that aurelia would see the change and update the dom. Well that didn’t work. So here is what I did that made it work.
initQueue() { //This init worked like a champ it was ran from constructor of element. Also direct indexing was ok here as well.
let i;
for (i = 0; i < 6; i++) {
this.queue.splice(i, 1, ‘1’);
}
}
pushQueue(v) {
let i;
for (i = 5; i > 0; i–) this.queue.splice(i, 1, this.queue[i - 1]);
this.queue.splice(0, 1, v);
this.queue = this.queue.map( x => x); // This line made the dom update with the values of the array.
//this.queue=this.queue //this also doesn’t work if anyone cares.
}
Would anyone care to explain to me why splice was not enough to make the dom update and yet the map worked.