我在主/详细视图中遇到路由问题.如果我去路线/主人,InfoComponent应该显示一些一般信息.如果我转到/ master / 1,DetailsComponent应显示id为1的项目的一些数据.在这两种情况下,MasterComponent都应该显示所选的id或什么都不显示.
我可以让这个工作得相当好.但问题是我想在MasterComponent中订阅OnInit中的selected:id,以便我可以在那里突出显示它,如下所示:
this.selectedId = this.route.params.map((params: Params) => params["id"])
但这不起作用:id是子路径参数.而且我不能使用this.route.firstChild,因为firstChild将是另一条路径,具体取决于InfoComponent或DetailsComponent是否显示.
当MasterComponent在显示两个子组件之间发生变化时,我可以获得一个可观察的(of:id)吗?
这是我的路由模块:
@NgModule({ imports: [ RouterModule.forChild([ { path: "master",canActivate: [AuthenticationGuardService],children: [ { path: "",component: MasterComponent,children: [ { path: "",component: InfoComponent },{ path: ":id",component: DetailsComponent } ] } ] } ]) ],exports: [ RouterModule ] }) export class MyRoutingModule { }
所以我想要做的事情是这样的:
this.selectedId = this.route.params.map((params: Params) => params["id"])
其中this.selectedId是一个Observable,如果路由是/ master / 1则值为1,如果路由是/ master,则值为null.
解决方法
或
this.route.firstChild.params.map(...)
或使用共享服务将params更改从子级传递给父级.有关示例,请参见https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#bidirectional-service.