Improve this Doc

ngComponentRouter

Installation

Currently, the Component Router module must be installed via npm, it is not yet available on Bower or the Google CDN.

npm install @angular/router --save

Include angular_1_router.js in your HTML:

<script src="/node_modules/@angular/router/angular1/angular_1_router.js"></script>

You also need to include ES6 shims to support running on Internet Explorer:

<!-- IE required polyfills, in this exact order -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.33.3/es6-shim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.20/system-polyfills.js"></script>
<script src="https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js"></script>

Then load the module in your application by adding it as a dependent module:

angular.module('app', ['ngComponentRouter']);

Module Components

Type

Name Description
Router

A Router is responsible for mapping URLs to components.

ChildRouter

This type extends the Router.

RootRouter

This type extends the Router.

ComponentInstruction

A ComponentInstruction represents the route state for a single component. An Instruction is composed of a tree of these ComponentInstructions.

RouteDefinition

Each item in the RouteConfig for a Routing Component is an instance of this type. It can have the following properties:

RouteParams

A map of parameters for a given route, passed as part of the ComponentInstruction to the Lifecycle Hooks, such as $routerOnActivate and $routerOnDeactivate.

Directive

Name Description
ngOutlet

The directive that identifies where the Router should render its Components.

Service

Name Description
$rootRouter

The singleton instance of the RootRouter type, which is associated with the top level $routerRootComponent.

$routerRootComponent

The top level Routing Component associated with the $rootRouter.