How can I prevent url binding constant hash values ​​with a UI-Router?

Question

I use Angular2 and UI-Router 2 in no-hash mode for a simple application with some anchor links in the menu. For instance:

• https://example.com/blah/blech
• https://example.com/blah/blech#specifications
• https://example.com/blah/derp

If I go from a route with a hash to a URL without it, the hash will remain. For example, going from /blah/blech#specifications to /blah/derp through the menu leads to the browser address /blah/derp#specifications . Obviously, this is incorrect and actually limits somewhat, for example, when I return to /blah/blech and the hash value remains, sending a window to this anchor point.

Another side effect is page refresh in a somewhat unpredictable way. Moving from /blah/derp to /blah/blech#specifications refresh the full page.

The setup is pretty standard:

 export let derpState: Ng2StateDeclaration = { name: 'derpState', component: DerpComponent, url: '/derp' } 

How to combine hash links with UI-Router 2 with good results? (Alternatively, how can I use anchor links with UI-Router in other ways?)

Answer 1

which version of angular 2 are you using? Please update it. No need a name and that's it.

 import { ModuleWithProviders } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; import { DerpComponent } from './derp.component'; const derp: Routes = [ { path: 'derp', component: DerpComponent } ]; export const derpState: ModuleWithProviders = RouterModule.forChild(derp); 

Try it. Hope this helps you.