TypeScript Inheritance and Constructor Arguments
Clash Royale CLAN TAG#URR8PPPTypeScript Inheritance and Constructor Arguments
Using Angular 5 and TypeScript, in the following inheritance scenario, is it possible to not have to include MyService as an argument to the constructor of MyComponent?
MyService
constructor
MyComponent
export class CBasic {
// properties and methods
}
export class CAdvanced extends CBasic {
// constructor
constructor(
public myService: MyService
) {
// call constructor of super-class (required)
super();
}
// more properties and methods
}
export class MyComponent extends CAdvanced {
// constructor
constructor() {
// call constructor of super-class (required)
super(); // Error: [ts] Expected 1 arguments, but got 0.
}
}
The error I am getting is [ts] Expected 1 arguments, but got 0. in MyComponent.
[ts] Expected 1 arguments, but got 0.
MyComponent
The point is I want to include MyService in CAdvanced to avoid code-duplication in classes that inherit from it, e.g. MyComponent.
MyService
CAdvanced
MyComponent
MyComponent
This has nothing to do with "multiple inheritance".
– torazaburo
4 hours ago
@torazaburo Thanks, I have removed it from the title.
– Ben
10 mins ago
@ConnorsFan It may do something else.
– Ben
9 mins ago
2 Answers
2
You can make the injectable service a property.
export class CAdvanced {
@Inject(MyService)
public myService: MyService;
constructor() {
}
}
export class MyComponent extends CAdvanced {
constructor() {
super(); // no more error
}
}
Angular will inject the service to the base class via the @Inject decorator.
@Inject
Alternatively, you can make the parameter optional.
This will silence the error, but the value will be undefined.
undefined
export class CAdvanced {
constructor(public myService?: MyService) {
console.log(this.myService);
// above will print undefined
}
}
export class MyComponent extends CAdvanced {
constructor() {
super(); // no more error
}
}
The first solution is great, but what's the point of making it optional, since that will result in the service which I need not being injected?
– torazaburo
4 hours ago
@torazaburo I have no idea. The OP said he was getting a TypeScript error that the parameter was missing. Making it optional suppresses the error, and I do clarify that it becomes
undefined. It's up to the OP to decide if that's how he/she wants to fix the error. Maybe there are some derived classes that have the parameter and others that don't. Who knows.– cgTag
4 hours ago
undefined
@cgTag Thanks, the first solution helps!
– Ben
9 mins ago
You extends CAdvanced, which requires one parameter in constructor. So it must be provided.
CAdvanced
I get that it needs the parameter when doing it this way, the question is if there is another way?
– Ben
5 hours ago
Turns out there indeed is another way, see answer by @cgTag.
– Ben
6 mins ago
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
Does the constructor in
MyComponentdo anything else? If not, you can just remove it.– ConnorsFan
4 hours ago