Directive in Angular
What is Directive in Angular?
Angular application mainly based on Directives.
A directive is a class with a @Directive decorator.
Directives are the mechanism of Angular2, which use to extend the HTML Elements and attributes in Angular Application.
Directive also guide compiler to render specific view or behavior for certain HTML elements or attribute, They are also key part of Angular Apps and components are also subset of Angular Directives so that’s why you can also call coponent asan type of Directive
How Directive Extend HTML elements and Attributes in Angular?
Directive have built-in DOM attributes which are not listed in HTML5 document, for example ngClass,ngStyle,ngModel.
Directives also allow developers to create custom HTML elements with templates and attributes and use them into application. for example <app-root>,<app-demo>selectors used in components.
Types of Directives in Angular
In angular there is follwing three types of Directives available:
1.Attribute Directives :
Attribute Directives Change the appearance or behavior of an element,component or another directive.
Eg : ngClass, ngStyle
2.Structural Directives :
Structural Directives change the DOM layout by adding and removing DOM elements.
Components Directives are directives with the template.
Attribute and Structural Directives are used in Components template.