Angular UI Router state.go and anchor tags

Issue

The following element:

<p ng-click="$state.go('state.a',{id: 'subsection-b'})">Click me</p>

is (when clicked) only navigating to the top of my state.a page and not scrolling down to the

<p id="subsection-b">...</p>

element on that page.

Why is that and what do I need to modify to get anchor tags to work with state.go? (BTW I know how to solve it with ui-sref but I need it to work with state.go)

Solution

The id in $state.go('state.a',{id: 'subsection-b'})" is a state parameter! It’s not an html ID attribute.

for that you should use state url:

<a href="[state_url] + #subsection-b"><p>Click me</p></a>

that [state-_url] is the url you set for state in its definition.

Answered By – Mahmoud

Answer Checked By – Willingham (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.