Angularjs update scope variable without re-repeating

Question

I have a situation where I have items being assigned to the scope, such as:

$scope.items = [{
   name: 'one',
   value: 1
}{
   name: 'two',
   value: 2
}]

Then I'm using ng-repeat to display this. I have a service that pulls data every few seconds and updates this scope variable. The problem is that it re-iterates when you update it. I've tried to use angular.forEach and iterate through what is currently in scope vs what's new and simply update the values at the appropriate keys, but this doesn't seem to actually update the values, that have already been iterated.

I don't want it to re-iterate every time there's an update. I have some styles that are being applied within a directive that when it re-renders it ignores those style changes (it's overriding them) also there's just no reason to re-render every item, when only one or two may have updated values. Would anyone know a good solution for this?

Thank you!

maurycy · Accepted Answer · 2014-06-18 20:47:31Z

3

https://docs.angularjs.org/api/ng/directive/ngRepeat

ng-repeat have now an amazing option called track by if you have an unique value in your objects i.e. id then you can use it like this

<span ng-repeat="item in items track by item.id">{{item.name}}</span>

I've tested it heavily since I had to use $$hash manualy before, it works nice and smooth

answered Jun 18, 2014 at 20:47

maurycy

8,4201 gold badge30 silver badges44 bronze badges

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

2 Comments

dzm Over a year ago

That's a good idea, then in my directive I can just update the changed values in dom, which will be fine for this purpose. Thank you!

maurycy Over a year ago

For me ng-repeat improved a lot with track by. Now it doesn't cost you a lot of DOM operations when updating a big whole object and if you shift one element or add one then only those elements DOM will be manipulated

Collectives™ on Stack Overflow

Angularjs update scope variable without re-repeating

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related