CODEWITHSUNDEEP
angularjs
epitka
epitka

Reputation: 17657

Why does ng-include keep calling expression over and over?

If I use an expression in ng-include instead of a literal, the expression is evaluated over and over until all watchers are done.

I can see how this has to behave that way, but I want to confirm that really is the expected behavior and if there are workarounds.

For example, this fragment will cause getTempalteUrl to be called as many times as AngularJS goes through its cycle:

<div data-ng-include="getTemplateUrl('RelatedInsureds')"></div>

Here is the JavaScript:

function getTemplateUrl(routeName) {
      var route = _.findWhere(routes, { name: routeName });

      if (route == null) throw (routeName + " is not defined in config.route.js");

      return route.config.templateUrl;
 }

Upvotes: 0

Views: 257

Answers (2)

epitka
epitka

Reputation: 17657

So after realizing that only function will be re-evaluated, I moved this to a scope and this will not cause my getTemplateUrl to be called multiple times. 

$scope.relatedInsuredsTemplateUrl = $scope.getTemplateUrl('RelatedInsureds');

and my html fragment now is this (no single quotes needed as this is not a literal)

<div data-ng-include="relatedInsuredsTemplateUrl"></div>

Upvotes: 0

Ant&#243;nio S&#233;rgio Sim&#245;es
Ant&#243;nio S&#233;rgio Sim&#245;es

Reputation: 981

Like you already realized, this is the expected behavior simply because ngInclude's src attribute will be re-evaluated on each $digest cycle.

One thing though, does this fact pose a problem to you? In CSS you usually dont care how many times the browser repaints, right? Well...as long as your function is light and fast, I wouldn't care if this function gets evaluated many times too.

I mean, does this code work for you? Yes.

Is it fast? Yes.

OK. So why look for a workaround?

Upvotes: 1

Related Questions