HTML DOM – AngularJS

To bind application data to attributes of HTML DOM Elements directives are used: ng-disabled, ng-show, ng-hide, ng-click.

HTML DOM Elements directives:

ng-disabled:
It is used for disabling a given control.

 <input type="checkbox" ng-model="enableDisable">Disable
 <button ng-disabled="enableDisable">Click Me</button>

ng-show:
It is used for showing a given control.

 <input type="checkbox" ng-model="showHide">Show
 <button ng-show="showHide">Click Me</button>

ng-hide:
It is used for hiding a given control.

 <input type="checkbox" ng-model="showHide">Hide
 <button ng-hide="showHide">Click Me</button>

ng-click:
It is used for representing a AngularJS click event.

 <p>Total click: {{ counter }}</p>
 <button ng-click="counter = counter + 1">Click Me</button>