I have developed an Angular single page application that utilizes HTML routing and ng-route. This means that all the pages can be accessed through links such as:
example.com/products
example.com/home
However, I also have a blog section on my website which uses server-side routing with NGINX because it is created using Ghost:
example.com/blog
While accessing individual routes directly works perfectly fine, things get tricky when navigating within the Angular SPA:
/blog
When I try to access the blog route from inside the Angular app, it defaults to the default route, as expected. Even including a hard link like this doesn't always solve the issue:
<a href="http://example.com/blog">Blog</a>
Sometimes, it still navigates through the Angular SPA rather than going directly to the blog. I've come up with a workaround by adding the target="_blank" attribute to the link:
<a href="http://example.com/blog" target="_blank">Blog</a>
However, I'm not a big fan of redirecting users to new tabs or windows. Is there any way to explicitly force Angular to use server-side routing for specific routes?