Angular 如果是多个命名路由器出口,请获取当前出口名称

Angular 如果是多个命名路由器出口,请获取当前出口名称,angular,router,named,router-outlet,Angular,Router,Named,Router Outlet,在angular 4应用程序中,我们有多个命名路由器出口。 因此,url类似于: 让我们假设一个组件显示在一个特定的命名路由器出口中。 组件已在路由器、ActivatedRoute等中注入构造函数 组件如何从这些注入对象(或其他可能的对象)检索路由器出口的名称?我认为您可以通过RoutesRecognized事件获取所有命名出口。下面是一个示例代码 this.router.events.filter((event) => event instanceof RoutesRecognized

在angular 4应用程序中,我们有多个命名路由器出口。 因此,url类似于:

让我们假设一个组件显示在一个特定的命名路由器出口中。 组件已在路由器、ActivatedRoute等中注入构造函数


组件如何从这些注入对象(或其他可能的对象)检索路由器出口的名称?

我认为您可以通过RoutesRecognized事件获取所有命名出口。下面是一个示例代码

this.router.events.filter((event) => event instanceof RoutesRecognized).subscribe((result) =>  {
  console.log(result);
  const routesRecognizedEvent =  <RoutesRecognized>result;
  const state = routesRecognizedEvent.state;

  if( state && state.root ) {
    const root = state.root;

    const children = root.children;

    const allOutlets =  children.map(c => c.outlet);

    // allOutlets contains outletnames of current activated route



  }
});
this.router.events.filter((事件)=>routesRecognited的事件实例)。订阅((结果)=>{
控制台日志(结果);
const routesRecognizedEvent=结果;
const state=routesRecognizedEvent.state;
if(state&&state.root){
const root=state.root;
const children=root.children;
const allOutlets=children.map(c=>c.outlet);
//allOutlets包含当前激活路由的OutletName
}
});

嗯,这不是我所期望的,但很有用。谢谢但是:组件仍然无法知道它显示在哪个出口名称中(如果同一路线上存在多个出口名称)。它可以从路由器配置中看到此路由中的所有出口,但无法直接看到他自己的出口名称。@Dacian您找到了查找相应出口名称的解决方案吗?