Home » Javascript » Angular 2/4/5/6 PathLocationStrategy dynamic base href fails for child routes

Angular 2/4/5/6 PathLocationStrategy dynamic base href fails for child routes

Posted by: admin October 29, 2018 Leave a comment

Questions:

I followed this post regarding calculating the base href dynamically at run time so a hard-coded path does not have to be specified at build time: Angular 2 / 4 / 5 – Set base href dynamically

It works great as long as the navigation is initiated by client side router navigation. However, I ran into an issue when a child route is hard-linked to or refreshed (this works fine with top level routes).

The problem is the .js links in the index.html are relative to the current path (or base href if specified). Normally, this is fine as the route /base/parent will look for the .js files in /base/*.js or the base href statically specifies where to look. However, in the case of the dynamic base href and a child route, the .js files will be pointing to /base/parent/*.js which doesn’t exist. Furthermore, when using one of the standard web-server ‘redirect to index.html’ configs, it will result in a 404 causing the .js file to be rewritten to ‘index.html’ and the page load fails.

Is there any way I can use theadynamic base href & use child routes in this way?

Answers: