UI-router and linking to anchor tags on other pages?

Question

I am trying to do a simple cross reference hyperlink, as in "see 'checkboxes' under the 'ui controls' section", which in plain html might be <a href="uicontrols.html#checkboxes">

In my ui-router-based app, I am trying to use

<a href="" ui-sref="elements.uicontrols({'#': 'checkboxes'})">checkboxes</a>

to go to the state/page elements.uicontrols and then the anchor tag on that page.

It doesn't work, and some Googling turned up this: https://github.com/angular-ui/ui-router/pull/1867

Does anyone know a way to accomplish links like this?

Answer 1

You can try it may be solved your problem. you should use id in anchor tag of plain html page to create reference link.

In ui-router-based app

<a ui-sref="elements.uicontrols({'#':'checkboxes'})">checkboxes</a>

in plain html might be

<a id="checkboxes" href="uicontrols.html">check to another page link</a>

NB: should have sufficient content bellow the plain anchor tag to show that anchor tag at the top.