Stack Overflow
Stack Overflow

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
3
votes
1 answer

Angular appends component instead of replacing whole page using router-outlet

First of all. I have checked all similar questions and its accepted answers in stackoverflow but did not work any. I am using Angular 8.1.3 So the problem is when I click on routerLink it just appends my component on existing component but it should…
GeetT
  • 315
  • 3
  • 10
3
votes
1 answer

How do I navigate different child components within a mat-tab? (not in primary outlet)

My AppComponent contains a sidenav and a router-outlet. Each menu item allows me to navigate to a different feature. Each feature module has four main components: component 1: list => url /feature/list component 2: details => url…
bluebit
  • 83
  • 1
  • 8
3
votes
0 answers

Animate on different routes in Angular

I have a application that animates on route change. But, I don't want to animate on certain paths. I only want animation to trigger when the route path is NOT '/' Tried this and have been searching for a solution online but i can't find any:
ClydeFrog
  • 912
  • 1
  • 14
  • 38
3
votes
1 answer

Cannot see that router-outlet is an Angular component - router-outlet is not a known element

I am receiving the error: 'router-outlet' is not a known element: 1. If 'router-outlet' is an Angular component, then verify that it is part of this module. 2. If 'router-outlet' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the…
physicsboy
  • 5,656
  • 17
  • 70
  • 119
3
votes
3 answers

Router-outlet is not updating after Routerlink navigation

I'm creating a simple Angular app with a navigation menu. Each menu item has a Routerlink to navigate between the pages. Here's the pages : Home (#/home) Customer / Info (#/customer/info) Customer / Details (#/customer/details) Customer / Details /…
Junior Dussouillez
  • 2,327
  • 3
  • 30
  • 39
3
votes
1 answer

Angular Elements / router outlet

Can an Angular Element use the router outlet? And, if so, will that router outlet interfere with (interact with) the parent router outlet?
RichardZ
  • 345
  • 2
  • 6
  • 18
3
votes
0 answers

Angular 5 URL of named router outlets

Is there a way to change the url that the named router outlet displays, for example: http://.../me/(me:personal) to http://.../me/personal but the functionality to stay the same?
Igor
  • 247
  • 1
  • 7
  • 16
3
votes
1 answer

angular router outlet fails with routerLink outside AppComponent

I use angular 5.2.0 and I navigated to: /page/28/1 corresponding to: {path: 'page/:albumId/:pageNo', component: AlbumPageComponent} The AlbumPageComponent html contains:
Adrian
  • 3,321
  • 2
  • 29
  • 46
3
votes
0 answers

Angular 5 Route with children and named outlets not working

Updated to clarify my problem I'm trying to get routes with children and named outlets work but with no luck. The origin idea is to build a tabbed navigation, to have deep links inside my app. I've break down my sample stackblitz project to the…
ratfury
  • 203
  • 2
  • 9
3
votes
1 answer

angular 5 multiple router-outlets on a nested page

The problem is a combination of nested router-outlets, which I have working, with having multiple router-outlets on the child page. For simplicity, I have one Home page with a "Login" link

HOME COMPONENT (Splash Page)

Yogi Bear
  • 943
  • 2
  • 16
  • 32
3
votes
1 answer

Named router outlet and lazy loaded modules

I have problem with named router outlet and lazy loading module. I have 2 router outlets first without name and second is named mainapp. app.component.html app.main.component.html
3x3
  • 31
  • 1
  • 3
3
votes
0 answers

How can I get a Lazy Module to access a named outlet in Angular?

Problem: I have a lazy module that wants to use the popup router in my app.component.html. I have the following in my app component template: src/app/app.component.html