A Component is a directive that uses shadow DOM to create encapsulated visual behavior. Usually, components are used to create UI widgets by breaking up the application into smaller parts. In short, we can say that a component (@component) is a directive-with-a-template.
A list of the major differences between a Component and a Directive in Angular:
Component | Directive |
---|---|
Components are generally used for creating UI widgets. | Directives are generally used for adding behavior to an existing DOM element. |
We use @Component meta-data annotation attributes to register a component. | We use @Directive meta-data annotation attributes to register directives. |
It is used to break up the application into smaller parts called components. | It is used to design re-usable components. |
Only one component is allowed to be used per DOM element. | Multiple directives are allowed to be used per DOM element. |
@View decorator or templateurl/template is mandatory in a component. | A Directive doesn't use View. |
A component is used to define pipes. | In a directive, it is not possible to define Pipes |
Submitted questions and answers are subject to review and editing, and may or may not be selected for posting, at the sole discretion of w3Sniff.
Get Started
Comments
Leave a Comment