public

One-time binding in AngularJS

I've been a full-time Angular developer for about two years now, and I just now came across the correct way to implement pure one-time binding. You can use

7 years ago

Latest Post Deferring decisions in Evolutionary Architecture by Tim Sommer public

I've been a full-time Angular developer for about two years now, and I just now came across the correct way to implement pure one-time binding.

You can use this in views, but more importantly, use it in lists with ng-repeat for significant performance improvements!

Take a look at the following expressions:

<div>
   <p id="one-time-binding-example">One time binding: {{::name}}</p>
   <p id="normal-binding-example">Normal binding: {{name}}</p>
</div>

If the name changes, the second div will be updated. The first one will not, because you use the one-time binding '::' expression.

The main purpose of one-time binding expression is to provide a way to create a binding that gets deregistered and frees up resources once the binding is stabilized. Reducing the number of expressions being watched makes the digest loop faster and allows more information to be displayed at the same time.
-Angular documentation

So, one-way binding is faster! Use it in lists that get loaded once and you will immediately see improvements in performance and responsiveness!

Source: https://docs.angularjs.org/guide/expression#one-time-binding

Happy coding !

Tim Sommer

Published 7 years ago

Comments?

Leave us your opinion.