I understand that you can use track by expr
to specify how items are keyed in a ng-repeat
directive.
But without track by
, how does AngularJS identify items?
Could I control how objects are tracked by altering the object, without using track by
, for example?
From the docs:
If no tracking function is specified the ng-repeat associates elements by identity in the collection.
But this is not clear. What does "identity in the collection" mean?
I understand that you can use track by expr
to specify how items are keyed in a ng-repeat
directive.
But without track by
, how does AngularJS identify items?
Could I control how objects are tracked by altering the object, without using track by
, for example?
From the docs:
If no tracking function is specified the ng-repeat associates elements by identity in the collection.
But this is not clear. What does "identity in the collection" mean?
Share Improve this question asked Oct 30, 2014 at 12:27 tenfourtenfour 36.9k15 gold badges88 silver badges146 bronze badges 1- 2 afaik the default is: it injects an expando property - $$hashKey - into your JavaScript objects take a look at bennadel./blog/… – Whisher Commented Oct 30, 2014 at 12:40
3 Answers
Reset to default 3If you omit the track by
expression, then angular by default will track by $$hashkey
which is automatically inserted by angular to your list of objects. $$hashkey
is refer to as identity of collection.
You can find more here What is the $$hashKey added to my JSON.stringify result
If the repeat is performed on object keys then the tracking identifier is the key
e.g. ng-repeat="(key,value) in thingies"
For an array the tracking identifier is determined by calling the hashKey function for each array item. The ments from the hashKey function indicates how this is determined:
- string is string
- number is number as string
- object is either result of calling $$hashKey function on the object or uniquely generated id,
- that is also assigned to the $$hashKey property of the object.
Without a track expression a hash based on the value is puted. WIth a track expression you can supply your own function to pute the hash if you want that level of control.
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@*" data-semver="1.3.0" src="//code.angularjs/1.3.0/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-controller="myCtrl">
<h1>User Defined Indexer</h1>
<ul>
<li ng-repeat="item in data track by getTracker()">{{item}}</li>
</ul>
<script>
var app=angular.module("app",[]);
app.controller("myCtrl",function($scope){
$scope.data=[1,2,3,4,5]
$scope.getTracker = function(v){
return Math.random();
}
});
angular.bootstrap(document,["app"]);
</script>
</body>
</html>