On Browser reload Angular js 2 nested routes component not loading

Question

I have a routeconfig which creates a child route under a parent component, I noticed that all goes when I use (by clicking a href tag with the routelink set to the child route) a route link to access the nested route, but when I refresh the browser when on the child route or enter the child routelink directly in the browser it fails to load the child component i.e only the parent component loads.

url with issue - localhost:3000/#/dashboard/reservation

My route config is below

Main app component routes to parent component (Dashboard)

@RouteConfig([
  ...
  { path: '/dashboard/...', name: 'Dashboard', component: Dashboard}, 
  ...
])

Dashboard component creates child route
@RouteConfig([
  { path: '/reservation', name: 'Reservation', component: Reservation , useAsDefault: true},
]);

Where did you add ROUTER_PROVIDERS? I think you need to provide more information (more code) otherwise it's hard to diagnose. Any concrete error messages? — Günter Zöchbauer
– Günter Zöchbauer, Commented Apr 13, 2016 at 16:51
I think the issue is the custom route outlet directive I used, it tries to re-authenticate the user on browser refresh and somehow it blocks the child component from loading. The problem does not occur if i use the default route outlet. — Olabayo
– Olabayo, Commented Apr 13, 2016 at 17:03
I met the same issues, it coz of the error "ReferenceError: System is not defined" in the console. any luck? — Sajin M Aboobakkar
– Sajin M Aboobakkar, Commented Apr 20, 2016 at 10:05

Sajin M Aboobakkar · Accepted Answer · 2016-04-20 10:23:52Z

1

I had met the same issue but I resolved by using this code inside <head> of index.html.Its a bug with APP_BASE_HREF

<base href="/">
<!-- Set the base href -->
<script>document.write('<base href="'+ document.location +'"/>');</script>

answered Apr 20, 2016 at 10:23

Sajin M Aboobakkar

4,2374 gold badges34 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

On Browser reload Angular js 2 nested routes component not loading

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related