AngularJS facilitates you to extend HTML with new attribute. These attributes are called directives.
Directives are special attributes starting with ng- prefix.
We are going to discuss following directives which are the most common directives –
- ng-app:- This directive starts an AngularJS application.
- ng-init:-This directive initialize application data.
- ng-bind:-This directive binds the value of HTML inputs controls to application data.
- ng-model:-This directive binds the values of AngularJS application data to HTML input controls(input, selection, text area).
- ng-repeat:-This directive repeats HTML elements for each item an collection.
ng-app directive defines the root element. It starts an AngularJS application and automatically initializes or bootstraps the application when web page containing AngularJS application is loaded. It is also used to load various AngularJS modules in AngularJS application.
The ng-app directive also tells AngularJS that the <body> is the owner of the AngularJS application.
ng-init directive initializes an AngularJS application data. It is used to put values to the variables to be used in the application.
In the following example. we will initialize the variable
ng-bind directive bind the application data to HTML view. The ng-bind directive bind AngularJS data to HTML the same way as AngularJS expression.
This directive binds the values of AngularJS application data to HTML input controls. In following example, we’ve defined a model named “name” and access that variable using ng-bind directive.
ng-repeat directive repeats HTML elements for each item in a collection
We have so many other built in directives that we will discuss later.