import {Component, Injectable} from "@angular/core";
import {Utils} from "../../../shared/utils/utils";
@Component({
templateUrl: "goal-header.component.html"
})
export abstract class GoalHeaderComponent {
protected captionKeys: string[];
protected isVisible() : boolean {
return true;
}
protected abstract getFirstValue(): number;
protected abstract getSecondValue(): number;
protected abstract getThirdValue(): number;
private getFloat(number: number | string): number {
return Utils.convertToNumber(number);
}
private isValidNumber(number: number | string) {
return typeof number === "string" ? !Utils.isNaN(number) : !isNaN(number);
}
}
How can I rewrite above or fix the error? Latest ionic cli.
I would try to remove “abstract” ?
Not sure but kind of have the feeling that an abstract class can’t be a component in the same time…at least in my project all my abstract class aren’t use as component
Do we have documentation about this?
Don’t know, that’s why I wrote “I have the feeling” 
I use several abstract classes in my project and when I started I wasn’t able to use them as component, therefore I thought it was the way it suppose to be…but if you are more successful than me I would like to correct my misunderstanding
Note bene, just in case, I use abstract class like following:
export abstract class MyAbstractComponent {
}
@Component({
templateUrl: 'test.html',
selector: 'test'
})
export class TestComponent extends MyAbstractComponent {
}
and if I need an injection in the abstract class, for example navController:
export abstract class MyAbstractComponent {
doStuffs(navController: NavController) {
navController.push('whatever'); // Note, no this
}
}
@Component({
templateUrl: 'test.html',
selector: 'test'
})
export class TestComponent extends MyAbstractComponent {
constructor(private navController: NavController) {
}
ionViewDidLeave() {
this.doStuffs(this.navController);
}
}
inheritance works too:
export abstract class MyAbstractComponent {
doStuffs(navController: NavController) {
this.doSomethingBefore();
navController.push('whatever'); // Note, no this
}
protected abstract doSomethingBefore();
}
@Component({
templateUrl: 'test.html',
selector: 'test'
})
export class TestComponent extends MyAbstractComponent {
constructor(private navController: NavController) {
}
ionViewDidLeave() {
this.doStuffs(this.navController);
}
protected doSomethingBefore() {
console.log('yep');
}
}
That’s all I know about abstract 
1 Like