Reputation: 4872
This used to work well when I have only 1 level of routing but after having 2 levels it does not work.
I have a root router
{ path: '/', name: 'Index', component: Index, useAsDefault: true },
{ path: '/settings/...', name: 'Settings', component: Settings }
and in setting I have many more async routes.
AsyncRoute {aux: null, path: "./", name: "Overview", data: undefined, useAsDefault: undefined}
etc.
When I navigate via route-links it works but when I reload my page at say /settings/user/info it loads a blank page with ¸only stuff from root script but without anything in the router-outlet.
How do I fix this? Has it got something to do with the async routes having relative paths specified?
Upvotes: 0
Views: 782
Reputation: 4229
I had met the same issue but I resolved by using this code inside of index.html.Its a bug with APP_BASE_HREF
<head>
<base href="/">
<!-- Set the base href -->
<script>document.write('<base href="'+ document.location +'"/>');</script>
</head>
Upvotes: 1