Routing & Multiple Views

1. How to create a layout template and how to build an app that has multiple views by adding routing, using an Angular module called "ngRoute".

The routing functionality added by this step is provided by angular in the ngRoute module, which is distributed separately from the core Angular framework.

Layout template .This is a template that is common for all views in our application.

Other  "partial  templates" are then included into this layout template depending on the current "route"——the view  that is currently displayed to the user.

2.

Application routes in Angular are declared via the $routeProvider, which is the provider of the $route service. This service makes it easy to write together controllers, view templates, and current URL location in the brower.

dependency injection is at the core of AngularJS.

When the application bootstraps, Angular creates an injector that will be used for all DI stuff in the app. The injector itself doesn't konw anything about what $http or $route services do,  in fact it doesn't even konw the existence of these services unless it is configured with  proper  module definitions.  The sole responsibility of the injector are to load specified  module definitions,  register all service providers  defined  in these modules,  and when asked, inject a specified  function with dependencies (services)

Providers can only be injected into config functions. Thus you could not inject $routeProvider  into  PhoneListCtrl.

Providers are objects that  provide(create) instances  of services  and  expose  configuration  APIs  that can be used to control  the creation  and runtime  behavior  of a service. In case  of the $route, the $routeProvider  exposes APIs that allow you to define routes  for your application.