4

In our angular 4 application we have multiple named router outlets. So the url is like : http://localhost:3000/main/(outletName1:Printers//outletName2:Printers)

Let's suppose one component is displayed in one particular named router outlet. Component has injected in constructor the Router, the ActivatedRoute, etc.

How can the component retrieve the name of the router outlet from those injected objects (or others if possible) ?

Dacian
  • 678
  • 6
  • 12

1 Answers1

1

I think you can get all the named outlets via RoutesRecognized event. Below is a sample code.

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



  }
});
jacop41
  • 152
  • 7
  • 25
  • Well, not what I expect but useful. Thanks ! But: component still can not know into which outlet name it is displayed (in case multiple outlet names exists on same route). It can see from router config all outlets in this route, but can not see straightforward which is his own outlet name. – Dacian Mar 15 '19 at 09:53
  • @Dacian Did you find a solution for finding the corresponding outlet name? – westor Apr 22 '20 at 13:06