Angular version ^13.3.9
Problem When using multiple outlets and trying to render multiple of then in a lazy module makes the angular router route correctly BUT the outlet is not being rendered.
Flow (See example) User goes to home page url=''. This uses the primary outlet (no name)
User goes to parent page url='Parent:parent' , which creates the Layout for that page and its children. Parents have their own outlet named 'parentRoutes' which gets transformed to 'Parent:' for a cleaner url. Transformation happens in src/app/CustomUrlSerializer
User goes to child page url='Parent:parent/Child:'. Children have their own outlet named 'childRoutes' which gets transformed to 'Child:' for a cleaner url. Transformation happens in src/app/CustomUrlSerializer
Example https://stackblitz.com/edit/angular-p9qjhw?file=src%2Fapp%2Fapp.component.ts
Routing routes correctly. Have already tried:
UPDATE/PROGRESS
Currently got it to work for the first child clicked. Then it no longer works :(
Do you have to use named outlets? When using parent and child components you do not need them, as child components are automatically rendered in the router-outlet of the parent component. Named outlets are only used when you are required to have two (or more) outlets on the same component level.
Here is a working stackblitz from your example: https://stackblitz.com/edit/angular-ycn6cn?file=src/app/app.routing.ts