what is the difference between ng-if and ng-show/ng-hide
ngif directive remove or recreate a portion of the DOM tree based on the expression. If the expression is false then the element is removed from the DOM. If the expression is true a clone of the element is reinserted into the DOM.
<div ng-if=”1”></div> <div ng-if=”0”></div>
When an element is removed using ng-if the scope is destroyed. The new scope is created when the element is restored. The scope is created within ng-if inherits from parent scope
If you using ng-model is used within ng-if to the data from parent scope, if any changed happen from parent scope nothing will affect child scope.
ng-hide does not remove the elements from
DOM. It uses CSS style to hide/show element ( don’t need to add own class).
ng-if create a child scope when the condition is true. The ng-show/ng-hide does not create any child scope.
<div ng-show=”1”></div> <div ng-hide=”1”></div>