Angular Directives

AngularJS directives are used to extend HTML. They are special attributes starting with ng-prefix.

The directive can be applied as an attribute, element, class, and even as a comment, using the camelCase syntax.

AngularJS provides many built-in directives to help with web application development. These core directives are prefixed with ng-*.It should be noted that all core directives are prefixed with the ng keyword and should not be used while creating a custom directive. Some of the built-in directives present inside the

AngularJS library are as follows:

ngAppThis represents the root element of the application.
ngRepeatThis directive is used to iterate an array or properties inside the object.
ngIfThis directive is used to evaluate conditional expression and adds or removes the element from the DOM based on its result.
ngClickThis directive is used to attach a custom callback for a click event.
ngIncludeThis directive is used to fetch and compile the external HTML fragment and include it to the current document.
ngClassThis directive is used to manipulate CSS classes that are used for an element.
ngBindThis directive is used to replace the text content with the specified HTML.
ngBindHtmlThe ngBindHTML replaces an element's inner HTML with the specified HTML.
ngSubmitThis directive is used to attach a custom callback method to an onSubmit event of a form.
ngModelThis directive is used to attach a form element to a scope.

Because HTML is case insensitive, we can use a lowercase form. For the ngModel directive, we can use ng-model, ng:model, ng_model, data-ng-model, and x-ng-model in the HTML markup.
Related Tutorial
Follow Us #
Contents +