82

AngularJS ng-if Directive

The AngularJS ng-if directive is used to remove the HTML elements if the expression is set to false. If the if element is set to true, a copy of the element is added in the DOM.

ngIf is different from ngShow and ngHide which show and hide the elements while ngIf completely removes and recreates the element in the DOM rather than changing its visibility.

It is supported by all HTML elements.

Syntax:

Parameter explanation:

expression: It specifies an expression that completely removes the element if it returns false. If it returns true, it inserts an element in the DOM instead.

Let’s take an example to demonstrate ng-if directive.

See this example:

Test it Now