我的Angular应用程序包含一个主视口和一个右侧面板,该面板位于主视口之外。单击主视口中的某些内容会导致此右侧面板打开/关闭,我正在使用ComponentFactoryResolver
中的@angular/core
,以便动态创建面板组件并向其提供数据。到目前为止,这一切都很好,但是我最近注意到,当我尝试将ActivatedRoute
注入这些组件的ctor时,初始实例工作正常,并且可以按预期获得路线数据。但是,如果我从另一个上下文将应用程序旋转到同一视图(例如,我从URI中的顺序A转到顺序B,这将触发重新创建我的所有路线)并检查ActivatedRoute
数据,保存路径数据的BehaviorSubject
的值不变。
这对于除常规<router-outlet>
之外的常规组件来说似乎很好用,但是这些动态创建的组件似乎从未更新过。
我已经确认ngOnDestroy()
方法正在运行时组件已被销毁,每次我转到新顺序时都会再次调用ctor。
关于动态创建的组件,必须有一些特殊之处,导致其无法正常工作。您是否应该能够将ActivatedRoute
注入到不是由路由器创建的组件中?如果是这样,那不是理想的选择,但是我可以找到其他方法来解决它。
编辑
这是我用来渲染组件的代码
render(component: PanelViewPackage, outlet: PanelViewportOutlet): ComponentRef<any> {
outlet.viewContainerRef.detach();
if (!component.hasState()) {
let componentFactory = this._componentFactoryResolver.resolveComponentFactory(component.Config.Component);
let componentRef = outlet.viewContainerRef.createComponent(componentFactory);
// There seems to be 2 ways to create this component... is one way better than the other?
// let componentRef = componentFactory.create(outlet.viewContainerRef.parentInjector);
(<PanelViewportComponentBase<any>>componentRef.instance).applyResolve(component.Config.Resolver);
(<PanelViewportComponentBase<any>>componentRef.instance).applyRejector(component.Config.Rejector);
(<PanelViewportComponentBase<any>>componentRef.instance).applyData(component.Config.Data);
return componentRef;
} else {
let componentRef = component.getComponentRef();
outlet.viewContainerRef.insert(componentRef.hostView);
return componentRef;
}
}