Angular 5继承带依赖注入类时的TypeScript类型错误求助

你遇到的错误是TypeScript类型检查导致的：父类FooService中_bar的类型被声明为BarService，尽管你实际注入的是子类ExtBarService，但TypeScript只会按照父类的类型定义做校验，因此它无法识别子类特有的myBarVar属性。

以下是几种不需要额外注入BarService的解决办法：

1. 泛型父类（推荐，长期维护更友好） #

将FooService改造为泛型类，让子类可以指定具体的BarService子类类型，这样TypeScript就能正确推断_bar的实际类型：

@Injectable()
class FooService<T extends BarService = BarService> {
    constructor(protected _bar: T) {}
}

@Injectable()
class ExtFooService extends FooService<ExtBarService> {
    constructor(_bar: ExtBarService) {
        super(_bar);
    }

    someMethod() {
        return {
            key: this._bar.myBarVar // 类型检查完全通过
        };
    }
}

2. 子类重写属性类型 #

在ExtFooService中重新声明_bar属性，指定为ExtBarService类型（TypeScript 4.3及以上版本需要添加override关键字）：

@Injectable()
class ExtFooService extends FooService {
    protected override _bar: ExtBarService;

    constructor(_bar: ExtBarService) {
        super(_bar);
    }

    someMethod() {
        return {
            key: this._bar.myBarVar
        };
    }
}

3. 临时类型断言 #

如果只是临时解决问题，不想修改类的结构，可以在访问属性时用类型断言明确告诉TypeScript_bar的实际类型：

@Injectable()
class ExtFooService extends FooService {
    constructor(_bar: ExtBarService) {
        super(_bar);
    }

    someMethod() {
        return {
            key: (this._bar as ExtBarService).myBarVar
        };
    }
}

为什么不需要注入两个服务？ #

ExtBarService继承自BarService，它完全包含了父类的所有功能和依赖，注入ExtBarService一个实例就足以满足FooService的依赖需求，同时能让你访问子类特有的属性和方法。

内容的提问来源于stack exchange，提问作者Sampgun