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
0
votes
0 answers

Writing a unit test for component which uses router-outlet

Anyone know why I'm getting the error at bottom of question trying to instantiate a component which uses ? console.log('then'); is not getting called, so perhaps the compile is having issues? app.component.ts import { Component } from…
bobbyrne01
  • 6,295
  • 19
  • 80
  • 150
0
votes
1 answer

Angular seed gets stuck at "Loading..." after adding router-outlet

In a new Angular seed application (ng new), the application gets stuck at "Loading..." as soon as I add this to app.component.html: I did try injecting Router: export class AppComponent { constructor(router:…
lfk
  • 2,423
  • 6
  • 29
  • 46
0
votes
1 answer

Structuring Angular 2 application with interdependent components

I'am trying to find a good structure for an Angular 2 application which has something like interdependent components. Here's the basic idea of the problem: There should be side navigation menu component and a content area which should contain the…
Busy Beaver
  • 71
  • 5
0
votes
0 answers

cannot find primary outlet to load Component

I am using Angular 4 project and I have used ngSwitch to switch multiple layouts based on condition. So, at this time, I am getting error cannot find primary outlet to load Component. It is because of router-outlet but what is the best way to solve…
Jeeten Parmar
  • 5,568
  • 15
  • 62
  • 111
0
votes
0 answers

Secondary router-outlook in child component

Am I allowed to put a secondary router-outlet in any other component other than the AppComponent? Because currently when I do this and I try to activate it using a [routlerLink] I get an error in the console complaining that it cannot find an outlet…
Sammy
  • 3,395
  • 7
  • 49
  • 95
0
votes
0 answers

Router Outlets Angular 2

I am new to angular 2, as router-outlets are dynamic they replace the element by out components (correct me if I am wrong). Why my components are not displayed by using router-outlets? Here is my routing config : import { Routes } from…
Daniyal Javaid
  • 1,426
  • 2
  • 18
  • 32
0
votes
1 answer

Get clicked *ngFor item in router outlet Angular2

I've got an *ngFor generated list where each item is rendered from json. What I want is to get the clicked item in my router-outlet view while hiding the other items. Think of it as of a product list and product card. When you click on particular…
Alexandr Belov
  • 1,804
  • 9
  • 30
  • 43
0
votes
1 answer

Different routes for landing page and dashboard in Angular2

I am developing a blog site with Angular 2. Now I want to show a signup/login form on landing page when user visit my site only signup form will show no menu or header. Now when user logged in they will redirect to /dashboard and see the menus and…
Rakesh Roy
  • 930
  • 2
  • 12
  • 22
-1
votes
1 answer

How to pass data from guard of a child component to parent component?

I have a parent component that has a bun of tabs with links. Each tab has a link that will navigate to the child component. The parent tab has a header data such as client name, dob, gender, ... The parent component .HTML looks like the following: …
Ray
  • 781
  • 2
  • 17
  • 42
-1
votes
1 answer

Angular - How to make router-outlet directive ignore query params

I have a routing.module.ts file that contains the following code: export const routes: Routes = [ ... { path: ‘profile/:id’, component: ProfileComponent } ]; I have an app.component.ts file that contains the template:
Dylan
  • 949
  • 3
  • 13
  • 23
-1
votes
1 answer

Unable to manage two outlets [nested]. At http://localhost:4200/index, inner outlet shows blank

I am heaving routing rules like this. { path: 'index', component: IndexComponent , children: [ { path: '', redirectTo:'profile',pathMatch:'full'}, { path: 'profile', outlet: "inner", component: ProfileComponent }, // some…
mukund patel
  • 1,039
  • 10
  • 31
-1
votes
2 answers

Navigate to a lazy component which is a part of lazily loaded submodule in a named secondary/aux outlet

There are two modules app and lazy modules. Need do display a lazy component in a named secondary outlet. The 'lazy component' is part of the submodule 'lazy'. Navigation: this.router.navigate([{outlets:{primary:'lazy',…
Rk R Bairi
  • 1,289
  • 7
  • 15
  • 39
-1
votes
1 answer

Error: Cannot match any routes. URL Segment: '?'

I am trying to access a sub-route of the sub-route, as you can see in the skills-missions-init-routing.module.ts file, the first route worked but the second one could not access, every time I try to access the route it has this error. I wonder what…
Jonatas Rodrigues
  • 57
  • 1
  • 2
  • 12
-1
votes
1 answer

Navigate from Login page to Tabs in Ionic4?

I am creating an application and i want move from login Page to Tabs Page. When I try to navigate to Tabs page, its only showing Home page without Tabs. here is my Code. app-routing.module.ts import { NgModule } from '@angular/core'; import {…
Nadeem Yousaf
  • 563
  • 10
  • 31
-1
votes
1 answer

angular 5 multiple router-outlets and submodules

After going through the documentation and all the other questions, I am still unable to get a viable option working for my project. I've gone away from the named router-outlets option because it makes the url not as clean. It looks like with a lot…
k80oshea
  • 89
  • 1
  • 6
1 2 3
…
20
21