In this case is better ng-hide/show or ng-if?


#1

I am using Angular with Ionic on my application, I am having some issues with the ng-show so I decided to change and put ng-if instead, and now my app is working as I want, but I have some doubts. What about performance ? and is correctly what I am doing ?

this is how I have my code now:

            <div ng-if="betSlip.length >= 1">
              <div class="list betslip-item">
                <div class="item item-divider betslip-header">
                  APPLY TO ALL
                </div>

and this is how I had it:

            <div ng-show="betSlip.length >= 1">
              <div class="list betslip-item">
                <div class="item item-divider betslip-header">
                  APPLY TO ALL
                </div>

#2

ng-if increased performance but be careful when the condition of the ng-if often changes, the gain is not systematic.
Through the ng-if, we can now completely remove a piece of the DOM. But attention, the ng-if removes the scope during the destruction of the DOM element, causing it to lose all its contains.


#3

actually that’s what I want, I want to destroy all the child elements. But, what do you mean by :

[quote=“jimibi, post:2, topic:16490”]
be careful when the condition of the ng-if often changes, the gain is not systematic.
[/quote] ?


#4

If the test condition is often modified (in the javascript for example)
performance is worse, because Angular loses time to change the DOM.


#5

You might be interested in giving this a quick read.