Class is using Angular features but is not decorated. Please add an explicit Angular decorator
You'll need to add a @Component
decorator to that base class (which should probably also be declared abstract
).
This is the bare minimum you can get away with in Angular 9:
@Component({
template: ''
})
export abstract class BaseComponent {
@Input() teamName: string;
@Input() teamSize: number;
@Input() players: any;
}
For Angular 10+, see this answer.
From Angular 10, you can fix this issue by adding the decorator @Injectable() to your abstract base class like this:
@Injectable()
export abstract class BaseComponent {
@Input() teamName: string;
@Input() teamSize: number;
@Input() players: any;
}
While the accepted answer is correct in using @Component
, one minor downside is that it requires all constructor argument types to be resolvable by DI. So if your base class constructor takes a constant/literal - say, an enum - as a flag, you're going to have to set up a corresponding DI provider/token just to get it to compile.
You can however also resolve NG2007 using the @Directive
decorator instead, which doesn't require DI compatibility
See also: Missing @Directive()/@Component() decorator migration
Before:
export class BaseComponent {
@Input() TeamName: string;
@Input() teamSize: number;
@Input() players: any;
}
After:
@Directive()
export class BaseComponent {
@Input() TeamName: string;
@Input() teamSize: number;
@Input() players: any;
}