Angular 9 BaseComponent with @Injectable()

This is probably going to hit more people now that Angular 10 is out and the warning is now an error.

error NG2007: Class is using Angular features but is not decorated. Please add an explicit Angular decorator.

This blog entry shows some examples https://volosoft.com/blog/what-is-new-in-angular-10


In addition please note that 'Angular features' doesn't just mean dependency injection. Even the presence of ngOnDestroy() in your base class will trigger this.

I solved it by renaming ngOnDestroy() to _ngOnDestroy() and called it from the subclass on destruction of the actual @Injectable(). This seems a little dangerous if I were to ever subclass it again and forgot to call _ngOnDestroy() but I'm not sure I had much choice.


This pattern has been deprecated in v9 and is no longer supported in v10.

There is a migration that typically migrates these cases automatically https://angular.io/guide/migration-undecorated-classes and https://angular.io/guide/migration-injectable, however it may be that the inherited @Injectable() case is not handled.

Anyway, the resolution here is to add @Injectable() to the abstract base class.


The clue is in the message

Either add a @Directive decorator to BaseComponent

Adding a @Directive() to it should do the trick.

I'm just going through an upgrade now, and my base component automatically has the @Directive() decorator added.