用户手动更改导航栏时路由Angular2应用程序？

Question

I'm running the Angular2 sample tutorial app , and when I click links that navigate the application, such as "dashboard" takes me to localhost:3000/dashboard and heroes takes me to localhost:3000/heros without the whole app reloading as expected.

Now if I am at localhost:3000/dashboard and I manually modify the URL to localhost:3000/heros and hit enter, the app reloads and takes me to the heros view, however if I do this with Gmail and other javascript applications the application switches the view without reloading.

What's the name of the components that allow this functionality?

Is there an Angular or Angular2 way to implement this?

Answer 1

This may not be possible with the PathLocationStrategy . Gmail, Play Music, and other sites I see this functionality on all have a # in their URLs.

I switched the application to the HashLocationStrategy and this now functions as such.

The switch is facilitated by the adding an import to main.ts and configuring the router to use it.

import {Location, LocationStrategy, HashLocationStrategy} from '@angular/common';

bootstrap(AppComponent, [ APP_ROUTER_PROVIDERS, {provide: LocationStrategy, useClass: HashLocationStrategy}, HTTP_PROVIDERS, ]);