Setting up an application to support simple routes
Central to the behavior of single-page applications is the ability to perform navigation without a formal browser page reload. Angular 2 is well-equipped to work around the default browser page reload behavior and allow you to define a routing structure within it, which will make it look and feel like actual page navigation.
Note
The code, links, and a live example of this are available at http://ngcookbook.herokuapp.com/6214.
Getting ready
Suppose you have the following function defined globally:
function visit(uri) {
// For this recipe, you don't care about the state or title
window.history.pushState(null, null, uri);
}
The purpose of this is to merely allow you to navigate inside the browser from JavaScript using the HTML5 History API.
How to do it...
In order for Angular to simulate page navigation inside the browser, there are several steps you must take to create a navigable single-page application.
