最近我们从Angular 2.0升级到2.4,从那时起我们就遇到了继承问题。 如果我们调用孩子,所有依赖关系都会被定义。
这是代码:
@Injectable()
export class ChildComponent extends ParentComponent {
}
export class ParentComponent implements OnInit, AfterViewInit, AfterViewChecked {
constructor(protected _activitySettingsControlService: ActivitySettingsControlService,
protected _changeDetectionRef: ChangeDetectorRef,
protected _elemRef: ElementRef,
protected _apiService: ApiService) {
}
所有依赖关系都是以这种方式取消。
可能是什么原因?
答案 0 :(得分:1)
如果没有完整的例子,我们只能猜测。考虑使用以下作为请求的minimal, complete and verifiable example的起点。
显示组件继承和服务注入协同工作的代码示例:
import { Component, Injectable } from '@angular/core';
@Injectable()
export class SomeDependency {
public foo() {
return 'bar';
}
}
@Component({
selector: 'parent-comp',
template: `<h1>Hello from ParentComponent {{name}}</h1>`,
providers: [
SomeDependency
]
})
export class ParentComponent {
public name;
constructor(private dep: SomeDependency) {
this.name = this.dep.foo();
}
}
@Component({
selector: 'child-comp',
template: `<h1>Hello from ChildComponent. SomeDependency returned {{name}}</h1>`,
providers: [
SomeDependency
]
})
export class ChildComponent extends ParentComponent {
}
@Component({
selector: 'my-app',
template: `<child-comp></child-comp>`
})
export class AppComponent {
}
请参阅此plunker以获取一个工作示例:http://embed.plnkr.co/5VNDF6/
我(也是)在SO中提供示例的新手,所以我可能错过了一些最佳实践。希望人们会对改进建议发表评论。
总的来说,这个组件继承并不是最好的做事方式 - 我更喜欢组合而不是继承组件。继承 - 如果确实需要 - 可能更适合服务:http://embed.plnkr.co/jWiOTg/