AngularJS basic ng-if directive usage

AngularJS ng-if directive

AngularJS instance

Uncheck and remove content:

&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta charset="utf-8"&gt;
&lt;script src="/libs//1.4.6/"&gt;&lt;/script&gt;
&lt;/head&gt;
&lt;body ng-app=""&gt;

reserve HTML: &lt;input type="checkbox" ng-model="myVar" ng-init="myVar = true"&gt;

&lt;div ng-if="myVar"&gt;
&lt;h1&gt;Welcome&lt;/h1&gt;
&lt;p&gt;Welcome to my home.&lt;/p&gt;
&lt;hr&gt;
&lt;/div&gt;

&lt;p&gt;When the check box is unchecked DIV Elements will be removed。&lt;/p&gt;
&lt;p&gt;When check box is re-selected，DIV The element will be redisplayed。&lt;/p&gt;

&lt;/body&gt;
&lt;/html&gt;

Definition and usage

ng-if Directives are used to remove HTML elements when the expression is false.

If the result of the execution of the if statement is true, the remove element will be added and displayed.

ng-ifDirectives are different from ng-hide, where ng-hide hides elements, while ng-if removes elements from the DOM.

grammar

All HTML elements support this directive.

Parameter value

value	describe
expression	If the expression returns false, the entire element will be removed, and if true, the element will be added.

The above is a compilation of the basic knowledge of AngularJS. We will continue to add it later. Thank you for your support.