In-page anchors reload to application's Home page - how can I fix this?

[Carolin Collins]

Hi! I am not an Angular developer but hope someone here can help me please.

I am working on a project where an external supplier is developing an Angular application for our company. My job is to add a lot of HTML-based FAQ pages into the system. The HTML source is sitting on an external database for re-usability reasons and is being pulled into the application via API calls. 

As the page content is quite long, I want to use in-page anchors and accordions to help the reader move up and down the page. However, I have realised that this is not working as expected once I view the HTML's content in the Angular application. When I click on an in-page anchor link, the page reloads to the application's home page. 

My code is something like this:

<ul id="top" style="list-style: none; padding: 0;">

           <li><a href="#child1">This is my first anchor link</a></li>
            <li><a href="#child2">This is my second anchor link</a></li>
            <li><a href="#child3">This is my third anchor link</a></li>

</ul>

<h2 id="child1">This is my first heading</h2>
<p> ... </p>

<p><a href="#top">Back to top ↺</a></p>

<h2 id="child2">This is my second heading</h2>
<p> ... </p>
<p><a href="#top">Back to top ↺</a></p>
<h2 id="child3">This is my third heading</h2>
<p> ... </p>
<p><a href="#top">Back to top ↺</a></p>

Let's say the page sits at portal.xyz.com/faq/set_up_account, so clicking on the first anchor link should bring me to portal.xyz.com/faq/set_up_account#child1. However, instead it brings me to portal.xyz.com/home/#child1, which means it simply loads the application's home page. 

Is there anything that the developer's need to switch on in the Angular code to stop this from happening/any module or other functionality they need to install? Do I need to code my anchor links in a different way? Unfortunately, the relationship with the supplier is a bit strained due to circumstances created outside of my team. I therefore would prefer to go to them with a suggested solution in hand rather than just asking them to figure it all out for me.

Apologies if this seems like a stupid question for you Pros but any suggestions or pointers are hugely appreciated.  Thank you!!!

[Selvaraj Ulaganathan]

Hi,

This is selvaraj from Chennai. 

--
You received this message because you are subscribed to the Google Groups "Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/angular/0b06267d-3c03-4e94-b5d4-a6230e7cb1b9%40googlegroups.com.