# Arrays updating dom using array.map to trick it into updating

**URL:** <https://discourse.aurelia.io/t/arrays-updating-dom-using-array-map-to-trick-it-into-updating/1229>\
**Category:** Help Requests\
**Created:** [May 18, 2018, 8:38pm UTC](https://discourse.aurelia.io/t/arrays-updating-dom-using-array-map-to-trick-it-into-updating/1229 "2018-05-18T20:38:06Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Paul-J-Barrett](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/paul-j-barrett/32/556_2.png) [@Paul-J-Barrett](https://discourse.aurelia.io/u/Paul-J-Barrett)\
**Post date:** [May 18, 2018, 8:38pm UTC](https://discourse.aurelia.io/t/arrays-updating-dom-using-array-map-to-trick-it-into-updating/1229/1 "2018-05-18T20:38:06Z")

</div>

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](https://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.

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [May 18, 2018, 9:20pm UTC](https://discourse.aurelia.io/t/arrays-updating-dom-using-array-map-to-trick-it-into-updating/1229/2 "2018-05-18T21:20:03Z")

</div>

All array mutation methods are working properly for me. Can you give a repro of what is not working for you, maybe via gist ?