sabrehagen
sabrehagen

Reputation: 1637

UI Router event on navigate to self page

I'm using ui-router for my page routing in my AngularJS app. I'm encountering an issue where if I click a hyperlink on a page that refers to the page/route I'm already on (i.e. self), nothing will happen.

For example, if you're scrolled halfway down a page and you click a hyperlink that refers to the current page, it will seem as though the link doesn't load, when in actual fact nothing needs to be loaded as the user is already on the right page.

The goal in this situation is to have the viewport moved to the top of the page, but I cannot get any event from ui-router for this event. I've tried $stateChangeStart and $stateChangeSuccess, but as no route change occurs, these do not fire.

My urls are of the form http://localhost:3000/projects/myproject and ui-router is configured as follows:

state('app.projects', {
    url: '/projects/:projectname',
    templateUrl: 'projects.html',
    controller: 'ProjectsCtrl'
}).

Without adding extra logic in the controller (which would obfuscate the natural href="projects/myproject" format), what can be done to achieve this?

Upvotes: 1

Views: 833

Answers (2)

tommyd456
tommyd456

Reputation: 10683

Without controller:

<a ui-sref="stateName({reload: true})" target="_blank">Link Text</a>

With controller:

$state.go($state.name, {}, {reload: true});

Upvotes: 1

Tome Pejoski
Tome Pejoski

Reputation: 1582

You can simply use # at the end of the link. href="projects/myproject#"

Upvotes: 0

Related Questions