0

I found a few questions regarding ngShow vs ngIf but nothing that addressed my use case all that well.

I understand the differences between the two directives but for an application with many conditional UI elements (content, toolbar buttons, dropdowns, form fields, etc - some of which are in ngRepeats) which is the better choice - ngShow or ngIf? As the user navigates the application and loads different content into the UI, these conditions will be evaluated so this will happen regularly as opposed to one time as it might with something like user preferences or permissions. Also, much of the content that is conditionally displayed contains {{bindings}}. The number of extra watches is my concern with ngShow while the large number of DOM manipulations concerns me with ngIf.

Is there a best practice or guidance for this type of situation? Is there some threshold where one makes sense over the other? Or is it simply a matter of trying both to determine the performance impacts of each (easier said than done)?

Community
  • 1
  • 1
user1843640
  • 3,613
  • 3
  • 31
  • 44
  • I don't think there's a right answer here and you're definitely on the right track. Yes I'd limit the logic within the ng-repeats, however new with Angular 1.3 if you're on it has one way binding which will help. – user12121234 Nov 12 '14 at 02:45

1 Answers1

0

Always use ng-if if possible. Content which is not in the DOM must not be watched etc. if you have bindings. Therefore it performs better. Use ng-show only if

  1. you have complicated event handlers on DOM elements which can be hidden
  2. the hide/show value changes extremely often (DOM manipulation is expensive)
Wendelin Wimmer
  • 49
  • 6