Angular: Binding strength in ngRepeat (aka operator precedence)

When you have an ngRepeat directive that uses track by, be sure to move the track by instructions to the very end of your statement, i.e. behind any filters.

Broken

Consider the following:

ng-repeat="child in category.children track by child.name | orderBy:'name'"

This will silently skip ordering; here is how AngularJS sees it (parentheses inserted to display binding strength):

ng-repeat="child in (category.children track by (child.name | orderBy:'name'))"

Working

Moving track by to the end will correctly apply filters.

ng-repeat="child in category.children | orderBy:'name' track by child.name"

For clarification, here is how AngularJS interprets our expression above:

ng-repeat="child in ((category.children | orderBy:'name') track by child.name)"

Note: Angular 1.3 introduces aliasing using as. Since I'm bound to Angular 1.2, I could not try its binding strength.

Dominik Schöler Over 9 years ago