One time binding called infinitely many times. Why?

Question

One time binding does not work in AngularJS. Why?

Here is the piece of code:

<div ng-repeat="c in ::relatedCasesInfo.hideRelations(type.cases, info) 
       | limitTo:relatedCasesInfo.initialRelationsAmount track by c.idFromFirst"
     class="initial-case-container">
    <ng-include ng-repeat="name in [c.name + (type.otherCasesArePresent || !$last || type.cases.length > relatedCasesInfo.initialRelationsAmount ? ', ' : '' )]"
        src="'dist/directiveTemplates/card/controls/relatedCases/casesContextMenu.html?v=' + $root.appVersion">
    </ng-include>
</div>

Here is the hideRelations function:

function hideRelations(relations, info) {
    return relations;
};

After running the html I see that the hideRelations is called infinitely many times. Why? What may I be missing here?

I guess `hideRelations` has more logic inside it, why do you need to bind the function in the view? — Alon Eitan, Mar 11 '20 at 16:14
Before include check the list if contains any item.(ng-if="if has value") — Shervin Ivari, Mar 11 '20 at 17:09

score 2 · Accepted Answer · edited Jun 20 '20 at 09:12

The framework re-calculates because the function either returns the value undefined or the calculation is unstable.

From the Docs:

One-time binding

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).

For more information, see

AngularJS Developer Guide - One-time Binding

One time binding called infinitely many times. Why?

One time binding does not work in AngularJS. Why?

1 Answers1

One-time binding