Skip to main content

Posts

Showing posts with the label Is it possible to have a multiple router-outlet in the same template?

Is it possible to have a multiple router-outlet in the same template?

Yes! We can use multiple router-outlets in same template by configuring our routers and simply add the router-outlet name. You can see in the example. Syntax- <div class= "row" > <div class= "user" > <router -outlet name= "userList" > < /router-outlet> </div> <div class= "userInfo" > <router -outlet name= "userInfo" > < /router-outlet> </div> </div> And setup your route config: const routes: Routes = [ { path : '' , redirectTo : 'home' , pathMatch : 'full' }, { path : 'home' , component: HomeComponent }, { path : 'user' , component: userComponent , children : [ { path : 'userList' , component: userListComponent , outlet : 'userList' }, { path : ':id' , component: userInfoComponent , outlet : 'userInfo' }] }]; @ NgModule(...