AngularJS ng-repeat not updating properly when delete items in array

Question

The problem that I'm facing is that I have a ng-repeat and when I delete an item by clicking a button with a function associated to delete items in array the ng-repeat not shows properly the actual array.

The array looks like:

['stuff', 'stuff', 'stuff', ....]

What shows ng-repeat when I delete an item is the array without the last position although I deleted the first position. When I perform a console.log the array looks correct, the first position or x position was removed.

Can you show the code that does the deletion and the html fragment containing the ng-repeat? — Gruff Bunny
– Gruff Bunny, Commented Mar 4, 2014 at 7:50
@refrigerator No, it is an example only. I have an array of differents images(src). — xmarston
– xmarston, Commented Mar 4, 2014 at 8:39
Is Images an array or an object? The reason I ask is that the ng-repeat is treating it as an object and when you delete you treat it as an array (using splice) — Gruff Bunny
– Gruff Bunny, Commented Mar 4, 2014 at 9:15

xmarston · Accepted Answer · 2014-03-06 06:39:17Z

3

The problem was the:

track by $index

Due to some duplicate images in the proofs I've been doing. I removed it and it works as expected.

answered Mar 6, 2014 at 6:39

xmarston

8833 gold badges13 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Virgiliu Over a year ago

This worked for me as well. I used it because angular was complaining about duplicates. To stop angular complaining about duplicates I used aron.duby's answer: instead of ['a', 'a','a'] I used [{'text':'a'}, {'text':'a'}] and got no more duplicates errors.

Steven · Accepted Answer · 2014-07-02 04:13:19Z

2

I was having this issue, I eventually narrowed it down to having something to do with the angular not being notified that something changed. To work around this, try using $apply. So something like this:

$rootScope.$apply(function() {
  // remove the item from the array 
})

answered Jul 2, 2014 at 4:13

Steven

4,9633 gold badges37 silver badges46 bronze badges

Comments

aron.duby · Accepted Answer · 2014-03-04 07:36:11Z

1

long answer: https://github.com/angular/angular.js/wiki/Understanding-Scopes

short answer, switch your array to be:

[{label:'stuff'},...]

answered Mar 4, 2014 at 7:36

aron.duby

2,3222 gold badges17 silver badges25 bronze badges

1 Comment

xmarston Over a year ago

My array looks right now [Object { label="xxx.jpg"}, Object { label="xxx.jpg"}, Object { label="xxx.jpg"}, Object { label="xxx.jpg"}]but I'm getting the same results...

Collectives™ on Stack Overflow

AngularJS ng-repeat not updating properly when delete items in array

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related