Directive:
- Directives help in modifying the behavior of an existing DOM element or adding new behavior to the DOM.
- Directives are created by using the @Directive() decorator, and can be structural (which modify the DOM structure – ngIf, ngFor or ngSwitchCase) or behavioral (add new behavior to the existing DOM elements – ngStyle, ngClass or ngModel)
- Directives don’t possess their own View
Component:
- Components are considered as a special branch of directives which can control a small portion of the View
- Components are associated with an encapsulated View Template, Style and the View Logic (class) parts
- These are created by using the @Component() decorator