首先,我们使用ui-router和路由解析将数据注入组件。
我们有许多类似这样的基本组件继承的组件
@Component({
....
})
export class ChildComponent extends BaseComponent{
}
====================
@Component({
....
})
export class BaseComponent implements OnInit, AfterViewInit{
constructor(serviceOne: ServiceOne, serviceTwo: ServiceTwo) {
}
}
之前,在基本组件构造函数中,我们注入了许多服务
constructor(serviceOne: ServiceOne, serviceTwo: ServiceTwo) {
}
这意味着这些必须从子组件中传递下来
@Component({
....
})
export class ChildComponent extends BaseComponent{
constructor(
@Inject('dataFromRouteResolver') dataFromRouteResolver,
serviceOne: ServiceOne,
serviceTwo: serviceTwo){
super(serviceOne, serviceTwo) {
}
}
由于我们有大量的服务和组件都来自同一个基本组件,因此维护起来变得有些费力,因此在阅读本文之后;
我们决定实现AppInjector并使用jector.get(ServiceOne)来获取服务,因此基本组件构造函数如下所示;
private serviceOne: ServiceOne;
private sericeTwo: ServiceTwo;
constructor(){
const injector = AppInjector.getInjector();
this.serviceOne = injector.get(ServiceOne);
this.serviceTwo = injector.get(ServiceTwo);
}
这很好用,并且确实清除了我们的派生组件代码和import语句;不需要通过super()
将任何东西传递给基本组件构造函数。一个障碍是,角度通用停止工作。使用此模式的任何页面在ui视图中都没有。如果我继续使用旧方法,将所有内容注入派生组件中并将其传递给基本组件,则角度通用将再次起作用并返回整个模板。
我是否在绞盘中缺少某种周期或顺序的东西,该模板是先以通用角度编译的?
任何帮助表示赞赏。谢谢。