Блог

Я пытаюсь использовать несколько розеток маршрутизатора в одном компоненте. Ниже приведен пример кода.

 lt;divgt;  lt;button matRipple matRippleColor="#FFFFFF20" class="btn btn-lg buttonLarge mx-4" [routerLink]="[{ outlets: {myoutlet: ['componentOne']}} ]" matTooltipPosition="below"gt;  Navigate One  lt;/buttongt;  lt;button matRipple matRippleColor="#FFFFFF20" class="btn btn-lg buttonLarge" [routerLink]="[{ outlets: {myoutlet: ['componentTwo']}} ]" matTooltipPosition="below"gt;  Navigate Two  lt;/buttongt;  lt;/divgt; lt;router-outlet #outlet="outlet" name="myoutlet"gt;lt;/router-outletgt;  

Но я не могу отобразить компонент в розетке. Любое предложение будет полезным

вы должны назвать свою розетку маршрутизатора так:

 lt;router-outlet name="outlet-one"gt; lt;router-outlet name="outlet-two"gt;  

затем в конфигурации вашего маршрутизатора:

 {path: '/routerOne', component: firstComponent, outlet: 'outlet-one'} {path: '/routerTwo', component: secondComponent, outlet: 'outlet-two'}  

Убедитесь, что вы определили имя розетки в файле модуля маршрутизации для каждого компонента, примерно так

 {path:'your_path_name',component:'componentOne',outlet:myoutlet}, {path:'your_path_name',component:'componentTwo',outlet:myoutlet}