Selecting a LocationStrategy for path construction

A simple but important choice for your application is which type of LocationStrategy you want to make use of. The following two URLs are equivalent when their respective LocationStrategy is selected:

• PathLocationStrategy: foo.com/bar

• HashLocationStrategy: foo.com/#/bar

Note

The code, links, and a live example of this are available at http://ngcookbook.herokuapp.com/1355/.

How to do it...

Angular 2 will default to PathLocationStrategy. Should you want to select HashLocationStrategy, it can be imported from the @angular/common module. Once imported, it can be listed as a provider inside an object literal:

[app/app.module.ts] 
 
import {NgModule} from '@angular/core'; 
import {BrowserModule} from '@angular/platform-browser'; 
import {RouterModule, Routes} from '@angular/router'; 
import {RootComponent} from './root.component'; 
import {DefaultComponent} from './default.component'; 
import {ArticleComponent} from...