jhhoff02 jhhoff02 - 2 months ago 35
TypeScript Question

Angular2 Final: Page Refresh error, 'Cannot GET' route. HashLocationStrategy failed

I have recently upgraded to Angular2 final release. I don't think this is a duplicate because HashLocationStrategy stopped working for me after the Angular2 Final/RC7 update. Previously, refreshing the page would fetch/GET the related route with a hash (#) and reload the page. Now, I get this error on any refreshed page:

enter image description here

I believe this is happening because it is trying to load

http://localhost:3000/main/home
instead of
http://localhost:3000/#/main/home
.

Any idea why
HashLocationStrategy
stopped working? Should I be importing
HashLocationStrategy
in my
@NgModule
?

Answer

You should set LocationStrategy to HashLocationStrategy in your AppModule's providers:

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

@NgModule({
    imports: [
        ...
    ],
    declarations: [
        ...
    ],
    bootstrap: [...],
    providers: [
        { provide: LocationStrategy, useClass: HashLocationStrategy }
    ]
})

export class AppModule { }
Comments