What does two colons inside an angular expression {{::}} mean?

JavascriptAngularjsAngular Template

Javascript Problem Overview


What is the difference between:

{{::office.name}}

and

{{office.name}}

in angularJS?

Javascript Solutions


Solution 1 - Javascript

One-time binding From Angular Docs.

> An expression that starts with :: is considered a one-time expression. One-time expressions will stop recalculating once they are stable, which happens after the first digest if the expression result is a non-undefined value (see value stabilization algorithm below).

In many situations, the values need to be only shown in the view and are never going to update from view or controller. However, if two-way binding is used, $digest will check for any changes in the expression in each cycle, which is not necessary. In these cases, :: should be used before expression. As stated in the above statement, this is more efficient than two-way binding syntax for such cases.


Blog: AngularJS one-time binding syntax from @Todd Motto

> In a nut shell, when we declare a value such as {{ ::foo }} inside the DOM, once this value becomes defined, Angular will render it, unbind it from the watchers and thus reduce the volume of bindings inside the $digest loop. Simple!

Solution 2 - Javascript

The {{::office.name}} syntax is Angular's One-Time binding, available since version 1.3
Here's a nice blog explaining it.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionJ0BView Question on Stackoverflow
Solution 1 - JavascriptTusharView Answer on Stackoverflow
Solution 2 - JavascriptTeo.skView Answer on Stackoverflow