0

It might be related to this question: When to favor ng-if vs. ng-show/ng-hide?

But I don't find a direct answer -- that is, if ng-if evaluates to false, and there are a lot of logic under the children, such as other ng-show, ng-repeat, etc, then will ng-if just skip all those logic?

On the other hand, ng-show or ng-hide will actually run all those logic, create all the proper DOM elements, but just use CSS's mechanism of display: none to hide or show it? In other words, it could run potentially slow.

So if that's the case, if given a choice between ng-if and ng-show, if we know the elements (and all its children) won't need to be shown no matter what -- that is, it won't need to be shown by some flags or some toggle in the controller (but a flag in the database tells us not to show this item or section) -- then we may as well use ng-if to skip all potential processing?

Community
  • 1
  • 1
nonopolarity
  • 146,324
  • 131
  • 460
  • 740

1 Answers1

0

Correct.

If the expression in ng-if evaluates to false, child directives, controllers etc will not be initialized/process because they are not yet added to the DOM. ng-show on the other hand just hides the presentation, the elements exist on the DOM and associated controller/directive functions will be process like a normal $digest.

Also, if the expression does evaluate from true, child directive linking functions and controllers will be processed. If the expression alternates between true and false, $destroy events will be fired when false giving you an opportunity to clean up your directives, controllers, $scopes etc, and linking/controller functions will be processed again once true.

This answer here gives an example showing the order of ops for digestion which will happen once if is true.

Community
  • 1
  • 1
Darren Reid
  • 2,322
  • 20
  • 25