Luca Poddigue
Luca Poddigue

Reputation: 1082

Is AngularJs digest cycle triggered after any function call?

I have a directive that defines a function innerBarStyle() at the link stage and binds it to the scope:

restrict : 'EA',
scope: {
  values: '='             
},
link: function(scope, elements, attributes){
  scope.innerBarStyle = function(value){
    console.count("innerBarStyleCounter");
    return {
        width: 10px;
    };
  }),
templateUrl: 'template.html'
};

The function does nothing but counting the number of times it gets executed and returning an object.

Now, in a template directive's template I'm calling this function by means of an expression. Something like <div ... ng-style=innerBarStyle(someValueInCurrentScope)><div>

What I get in practice is an infinite loop that causes the aforementioned function to be called repeatedly. After some research, I've found that this usually occurs when the called function implicitly or explicitly triggers the digest cycle (e.g. if it makes use of the $http service). But in this case the function is really doing nothing. Is it possible that the digest cycle is triggered somewhere else or am I missing something? BTW, I know that there would be better ways to achieve the same result, I'm just curious about how things works here.

Upvotes: 4

Views: 576

Answers (1)

jusopi
jusopi

Reputation: 6813

Without seeing the actual code (I understand you can't post the exact code since it's for your work) I can only guess. But I think what's happening is that you are adjusting the style of the element via the return of the $scope. innerBarStyle which triggers the ng-style directive which calls a digest cycle, which triggers the scope function again. Ergo the continuous execution of this logic.

In order to fix this you should probably use the angular.element APIs on the elem of the directive to adjust the CSS.

Upvotes: 1

Related Questions