Simple One way binding for ng-repeat?

angularjs angularjs-ng-repeat
Dionysian picture Dionysian · Nov 5, 2013 · Viewed 25.5k times · Source

I have read some articles that said ng-repeat would led to poor performance if there is over 2000 items, because there are too many two way binding to watch. I am new to angularjs and have trouble understanding the relationship between ng-repeat and two-way binding:

  1. Does ng-repeat (like outputting a list of json objects) necessarily create two way binding?

  2. Is there a simple way to do ng-repeat using only one way binding? (preferably do not need external module)

Answer

Cindy Conway picture Cindy Conway · Feb 5, 2015

Like user1843640 mentioned, if you are on Angular 1.3, you can use one-time-binding, but, just for clarity, you need to put the :: on all the bindings, not just the repeater. The docs say do this:

<div ng-repeat="item in ::items">{{item.name}}</div>

But, if I count the watchers, this only removed one. To really drop the number of two-way-bindings, place the :: on the bindings within the repeater, like this:

<div ng-repeat="item in ::items">{{::item.name}}</div>

Here are two plunkers that will display the number of watchers:

All Bindings
Repeater Only

Thanks goes out to Miraage for provinding the function to count the watchers https://stackoverflow.com/a/23470578/2200446

Related questions

AngularJS For Loop with Numbers & Ranges

Angular does provide some support for a for loop using numbers within its HTML directives: <div data-ng-repeat="i in [1,2,3,4,5]"> do something </div> But if your scope variable includes a range that has a dynamic number then …

Read More
How to iterate over the keys and values with ng-repeat in AngularJS?

In my controller, I have data like: $scope.object = data Now this data is the dictionary with keys and values from json. I can access the attribute with object.name in the template. Is there any way that I can …

Read More
Way to ng-repeat defined number of times instead of repeating over array?

Is there a way to ng-repeat a defined number of times instead of always having to iterate over an array? For example, below I want the list item to show up 5 times assuming $scope.number equal to 5 in addition incrementing …

Read More