Menu
I recently upgraded my Angular app from v9 to v10.
I noticed that undecorated classes are not supported anymore. See here
So during ng upgrade my abstract components without decorates have been changed to have a @Directive() decoratror.
For example
export abstract class AbstractFormControl implements ControlValueAccessor { ... }
was changed into
@Directive()
export abstract class AbstractFormControl implements ControlValueAccessor { ... }
Why does Angular use @Directive. Wouldn't @Component be a better way because the class is rather a Component than a Directive? What was the intention?
535
The Component is used to break up the application into smaller components. That is why components are widely used in later versions of Angular to make things easy and build a total component-based model. The Directive is used to design reusable components, which are more behavior-oriented.
A component is a single unit that encapsulates both view and logic whereas directives are used to enhance the behavior of components or dom elements and it doesn't have any templates. Component extends directive so every component is a directive.
In Angular, a Directive is essentially a typescript class which has been annotated with a TypeScript Decorator. The decorator is the @ symbol. Decorators are not currently part of the JavaScript functionality (although they likely will be in the future) and are also still experimental in TypeScript.
Component directive is used to specify the HTML templates. It has structure design and the working pattern of how the component should be processed, instantiated and used at runtime. It is the most commonly-used directive in any Angular project.
Component requires you to specify template or templateUrl, which cannot be used with
an abstract class.
As mentioned in the comments - Component is a special type of Directive. So it is okay to inherit from an abstract Directive.
156
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
