how does angular implement bind-once directives?

Question

I've looked through source code but haven't found relative piece of code. I'm particularly interested in bind-once watchers and the way to attach them. At the moment I've done the following:

var removeNodeTypeWatcher = scope.$watch(function () {
    return paneController.getNodeType();
}, function (value) {
    if (value) {
        scope.nodeType = value;
        // as soon as the value is defined we no longer need watcher
        removeNodeTypeWatcher();
    }
});

is getNodeType asynchronous? Otherwise, do you even need a watch? — Ricconnect
– Ricconnect, Commented Feb 18, 2015 at 8:24
good point, but the question is not about that :) let's assume that it is — Max Koretskyi
– Max Koretskyi, Commented Feb 18, 2015 at 8:28
bindoncedoes the same, unregister watch when value is resolved — Dieterg
– Dieterg, Commented Feb 18, 2015 at 8:46

Pankaj Parkar · Accepted Answer · 2015-02-19 10:53:02Z

2

You can use the specific expression

::

like so:

<div>{{::item}}</div>

or

<ul>  
   <li ng-repeat="item in ::items">{{item}}</li>
</ul>

to bind expression once since angular 1.3: bind once since 1.3

Also, there are specific libraries like:

angular-once or bindonce

EDIT:

I found the following function in the source of angularjs 1.3:

function oneTimeWatch(scope, listener, objectEquality, deregisterNotifier, parsedExpression) {
    var unwatch, lastValue;
    return unwatch = scope.$watch(function oneTimeWatch(scope) {
        return parsedExpression(scope);
    }, function oneTimeListener(value, old, scope) {
        lastValue = value;
        if (isFunction(listener)) {
            listener.apply(this, arguments);
        }
        if (isDefined(value)) {
            scope.$$postDigest(function() {
                if (isDefined(lastValue)) {
                    unwatch();
                }
            });
        }
    }, objectEquality, deregisterNotifier);
}

It is located at src/ng/parse.js, starting at line 1031:oneTimeWatch

However, in 1.4, the function is called

oneTimeWatchDelegate

edited Feb 19, 2015 at 10:53

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

answered Feb 18, 2015 at 8:29

Manube

5,2294 gold badges38 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Dieterg Over a year ago

And if you look at the source of bindonce you can see they use the same approach as Maximus

Max Koretskyi Over a year ago

@Manube, thanks, but I was asking about how this is implemented inside angular.

Max Koretskyi Over a year ago

@DieterGoetelen, can you point me to the source code line with bind once?

Dieterg Over a year ago

@Maximus awch, I was pointing to angular-once, source: github.com/tadeuszwojcik/angular-once/blob/master/once.js#L22

Manube Over a year ago

oops, sorry, had misinterpreted. Indeed the relative code seems well hidden, will keep looking...

|

Collectives™ on Stack Overflow

how does angular implement bind-once directives?

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related