CODEWITHSUNDEEP
javascriptangularjsangular-ui-router
jola
jola

Reputation: 1115

Angular UI Router state.go and anchor tags

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)

Upvotes: 2

Views: 3078

Answers (2)

Lindauson
Lindauson

Reputation: 3421

For anyone that needs the ui-sref syntax:

ui-sref="page({name: 'name', '#': 'frag'})"

Also, as Andrew Tobilko correctly points out, the syntax for the $state.go function uses a hash (#) not 'id':

$state.go('page', {name: 'name', '#': 'frag'})

Note: This requires ui-router v0.2.14 or higher.

Source: https://github.com/angular-ui/ui-router/pull/1867

Upvotes: 4

Mahmoud
Mahmoud

Reputation: 864

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.

Upvotes: 2

Related Questions