Loading...


Today, we are going to discuss about predefined Directives in angularJS. AngularJS projects some basic Directives that we use in angular application very frequently. As we know, Directive is used to change the behavior of HTML DOM elements at run time. Means, we can change color, font, events of any DOM element by using Directive.

Below is the list of Predefined Directives. 

ng-app: This directive is used to define the root element of AngularJS Application. And only one an-app directive can be defined in a page. 
Ex: <div ng-app="app-name"> </div>

ng-controller: ng-controller is used to add the controller in AngularJS Application and it define the scope of variables and functions. We make variables and function function within the controller.  
Ex: <div ng-app="app-name"><div ng-controller="controller-name"></div> </div>

ng-model: ng-model directive represents the model. Its primary responsibility is to bind the view to the model. This is used to "Two Way" data binding.
Ex: <input type="text" ng-model="model-name" />

ng-if: ng-if directive is used to remove the HTML element. If the value of expression is false. 
Ex: <div ng-if="expression or condition"></div>

ng-repeat: ng-repeat is used to repeat a set of HTML elements. Suppose we have a collection of objects and we have to show in page then we use ng-repeat directive. Like binding dropdown list, list of data that we have to show in page.
Ex: <table><tr ng-repeat="obj in CollectionObj"><td></td><td></td></tr></table>


ng-click: ng-click directive is used to fire an event on buttons or any elements. 

ng-change:
ng-show:
ng-class:
ng-style
ng-keydown:
ng-keypress:
ng-keyup:
ng-dblclick: