CODEWITHSUNDEEP
angular
andreasteich
andreasteich

Reputation: 153

Render multiple components within one route

I've got a Question: in Angular 7, is it possible to render multiple components within one route? For example there's the path: '' and I want to Display the components: [ HeaderComponent, SideBarComponent ]. So when the router is receiving the path: '/home' These two components mentioned before are displayed and now also the component: HomeComponent. I tried to figure it out, but I didn't find a way to get it done. Can anyone help me? What would be the best Approach in your opinion?

Thank you very much in advice!

Upvotes: 0

Views: 1891

Answers (1)

Mehdi Anis
Mehdi Anis

Reputation: 66

No router only accepts one component to a path. However a good practice is to put a wraper component say for example HomePageComponent and this would be the component you route to. The template should look like this

@Component({
    template: ´
    <app-header></app-header>
    <app-sidebar></app-sidebar>
    <app-home></app-home>
    ´})
export class HomePageComponent{}

Another solution is to use named router outlets

Upvotes: 4

Related Questions