CODEWITHSUNDEEP
angulartypescriptangular-cliangular7
bek
bek

Reputation: 195

Complex routes in angular 7

I want to create routes in angular 7, but this routes must be not as usual. I have an admin panel and navigation component. Those two components have different navigation bars. The case is to load admin panel by a router link and replace the default navigation component with the other admin panel's navigation. Admin panel has to load other components from admin folder when user routes to /admin path (only those components). And in other cases must be shown default navigation and components regarding to users route (router-outlet).

For example, I am going to /index path and must be shown default navigation component with index component in router-outlet. But if I go to /admin/dashboard I want to see admin panel's navigation and dashboard component as router-outlet.

How to realize this feature?

Some codes what I have now:

app.module.ts:

const appRoutes: Routes = [
  {
    path: 'index',
    component: IndexComponent,
  },
  { path: '', redirectTo: '/index', pathMatch: 'full' },
];

app.component.html:

<app-nav><router-outlet></router-outlet></app-nav>

The task is to change app-nav to admin-nav when user goes to /admin path.

Upvotes: 0

Views: 193

Answers (1)

bek
bek

Reputation: 195

The problem has been solved by using children components in routes params.

Upvotes: 1

Related Questions