Question

我试图学习Angular2，但遇到了一些麻烦。我有一个名为ParentService

的抽象服务类

export abstract class ParentService {

}

和另一个名为ParentService

的ChildService扩展的Service类

export class ChildService extends ParentService {

}

然后我有一个名为input.component

的组件类

import { Component } from "@angular/core";

import { ParentService } from "./service/parent.service";

@Component({
    selector: 'app-input',
    templateUrl: './input.component.html'
})
export class InputComponent {
    constructor(private parentService: ParentService) {}

}

在我的app.component中，我提供了ChildService的实例

import { Component } from '@angular/core';
import { ChildService } from './service/child.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [ChildService]
})
export class AppComponent {

}

然而，这不起作用。它构建良好，但在运行应用程序时我得到了一个错误：

EXCEPTION: Error in ./AppComponent class AppComponent - inline template:4:16 caused by: No provider for ParentService!

这可能吗？我只希望input.component知道ParentService。我真的不想让它知道实施情况。

Answer 1

你不能指望Angular2自动将子类连接到这样的原始类声明。如果您有两个子类DogService和CatService同时继承AnimalService列表中声明的providers，应该使用哪一个？

相反，您需要明确指定它：

providers: [{provide: ParentService, useClass: ChildService}]

文档：https://angular.io/docs/ts/latest/guide/dependency-injection.html

Answer 2

这是有可能的，但稍加一点。

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [{provide: ParentService, useClass: ChildService}]
})
export class AppComponent {

}

这里的问题是角度为2的DI不会试图推断出类之间的任何关系。因此，默认情况下，为了注入ParentService，您必须提供ParentService，period。但幸运的是，我们可以使用上面的构造覆盖此行为。它按字面意思告诉DI容器＆＃34;如果有人要求ParentService，则创建并给他们一个ChildService实例，而不是＃34;。

服务和提供者的继承和多态性

2 个答案: