ng-repeat with track by over multiple properties

Question

I have a problem with angular ng-repeat directive. Currently I work on some project where from the API I get a list of items (some times it could be 1k items) and this list

Answer 1

As the comment suggested you could try something like this:

<select ng-model="item" ng-options="item.id as item.description for item in items track by itemTracker(item)">

In your controller:

$scope.itemTracker= function(item) {
  return item.id + '-' + item.description;
}

This might help with the number of DOM elements being re-rendered when the list changes.

Answer 2

You do not need to create a function to handle track by multi properties. You can do:

<div ng-repeat="item in lines track by item.id+item.description">

Answer 3

Based my knowledge, the angularjs model is bind to the ui view, so the model will rerender via $apply or $digest once the value changed. so in your case, u wan bind the model value to ui view but also do not want to re-render the view if the value has not change,that is impossbile. this is what i know.

however, u can just manipulate the dom element. for example store the data to a variable

var x = [{id:"id1",value:"v1"},{id:"id2",value:"v2"}]

in html, manual append or using directive to append, then assign the id to the element,

<div id="id1">v1</div>

check and compare the value, based ur needs. once found, then angular.element("#yourid").text()

this will solve your browser resources consume problems.