Questions tagged [router-outlet]

Use it for questions about the angular 2 or 4 router-outlet element.

The router-outlet is part of the routing-system of angular 2 and above. Depending on the navigated route, a specific component can be displayd in a router-outlet.

Multiple <router-outlet/>-tags are possible in one component if you name at least all but 1 of them. Nested router-outlets working together with the child-property of routing-objects in the route-config of a NgModule

See also: https://angular.io/api/router/RouterOutlet

308 questions
4
votes
2 answers

Angular 11 - RouterModule - 'router-outlet' is not a known element

I’m new in Angular, at the moment I working on routing. I run into an issue using sub routes in a component. The routerLink aren’t rendered as link in the component. If I use the router-outlet the app crashes. Using the router-outlet I got the…
Christoph1972
  • 786
  • 3
  • 10
  • 21
4
votes
0 answers

Angular 8 Cannot match any routes on secondary(named) outlet of lazy loaded module

Angular 8 Cannot match any routes on secondary(named) outlet of lazy loaded module Hi all, Yes, this question considered a duplicate question. I have read the discussion from here Angular 5 Cannot match any routes on named outlet of lazy loaded…
4
votes
1 answer

When using nested children routes in ionic4, the routes stop working after one main navigation change

I would like to use nested routing for complex pages inside an ionic app. I leave the main ion-router-outlet in tact, and can navigate between top-level pages without any problems. Inside those top level pages, deep inside content, I would like to…
4
votes
2 answers

Angular auxiliary routes with named router-outlets: ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment

I am having a hard time getting auxiliary routes to work, even in a minimalistic scenario. I'm pretty sure, I stuck to the angular documentation on routes and multiple outlets down to a T, so I really have no idea what I am…
4
votes
1 answer

Multiple router-outlet lose url parameters

I'm building an angular 6 app that should have two specific router-outlet: The application is driven by a token which is specified in the…
Dams
  • 141
  • 3
  • 15
4
votes
1 answer

Link to another component without outlet

In my Angular5 app i have router-outlet named 'admin' (/admin), which have child router 'news' /admin/(admin:news), and i want create link to component CreatePostComponent /admin/(admin:news/new-post). Here is my router: { path: "admin", …
Volodymyr Humeniuk
  • 3,411
  • 9
  • 35
  • 70
4
votes
1 answer

How to use two router outlets for same path using Angular 5

I have the following template for AppComponent:
I want to use this template in two…
clemtoy
  • 1,681
  • 2
  • 18
  • 30
4
votes
1 answer

obtain the current outlet name in case of a multiple named router outlet

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…
Dacian
  • 678
  • 6
  • 12
4
votes
0 answers

Populating parent outlet in Angular2

I have the following routes defined in my app.module : RouterModule.forRoot([ { path: 'main', component: MainComponent, loadChildren: 'mySidebar.module#SidebarModule } ]) inside SidebarModule I define routes a: RouterModule.forChild( …
Yuvals
  • 3,094
  • 5
  • 32
  • 60
4
votes
3 answers

Multiple router-outlet on the page for the same route

In my root component, I have the following template:
ssougnez
  • 5,315
  • 11
  • 46
  • 79
4
votes
1 answer

Angular2 - named router-outlet doesn't navigate to component with child route

I have a parent component with button, function of which is to display child component inside. I am using named router-outlet to navigate to the child. My attempt is based on following example: https://github.com/vsavkin/router_mailapp (showing…
kyselm
  • 300
  • 3
  • 11
3
votes
2 answers

Issue with multiple layouts using route data in Angular

Fellow developers, I've got an app that makes use of multiple layouts (eg. the login route has no navbar, but dashboard routes have a navbar + footer). What I'm doing is adding the layout to use in the data property in the route definition, so for…
3
votes
1 answer

Error: Cannot match any routes. When lazy loading an Angular auxilary route

I am trying to make a nested child route call to load in an auxilary router outlet, but I cannot seem to make it work. I keep getting the Error: Cannot match any routes. URL Segment:'header/secondary/abc' StackBlitz Link:…
3
votes
0 answers

Angular Router dynamic Sidebar without always manually setting the sidebar

I'm working on an Angular application that uses the Router Outlet to dynamically load Content into the Sidebar. For example we do it like this
3
votes
1 answer

Angular 2+ navigation with mat-tab-nav-bar - accessibility

Angular material gives us in-app navigation with tabs. By Angular:
nirKa
  • 203
  • 3
  • 12
1 2
3
20 21