AngularJS routing
An AngularJS MVC implementation would not be complete if it didn't offer some way of controlling the application URL routing. While you could leverage the ng-include
directive to offer some routing features, it would be a mess to use it with multiple views. For that purpose, the AngularJS team developed the ngRoute
module that allows you to define URL paths and their corresponding templates, which will be rendered whenever the user navigates to those paths.
Since AngularJS is a single-page framework, ngRoute
will manage the routing entirely in the browser. This means that instead of fetching web pages from the server, AngularJS will load the defined template, compile it, and place the result inside a specific DOM element. The server will only serve the template as a static file but won't respond to the URL changing. This change will also turn our Express server into a more API-oriented backend. Let's begin by installing the ngRoute
module using Bower.
Note
The ngRoute
module...