I use Angular2 alpha39 and Babel to transpile the ES6 JS file. I\'m not using typescript.
I created a component which displays correctly. I added a
2.0.0-alpha.36 (2015-08-31)
routerInjectables
was renamed to ROUTER_BINDINGS
2.0.0-alpha.41 (2015-10-13)
ROUTER_BINDINGS
was renamed to ROUTER_PROVIDERS
USE ROUTER_PROVIDERS
ROUTER_PROVIDERS
is used to simplify bootstrapping the router.
It includes:
RouterRegistry
- the collection of registered routesLocationStrategy = PathLocationStrategy
- match by pathROUTER_PROVIDERS
provides 'sane' defaults and should be used unless you need to need a different route LocationStrategy
.
Change:
bootstrap(DashboardAppComponent);
To:
bootstrap(DashboardAppComponent, [
ROUTER_PROVIDERS
]);
Sources:
2.0.0-alpha.38 (2015-10-03)
Route aliases need to be CamelCase (technically PascalCase)
Note: this was mentioned already in Pardeep's answer under #3
If you want to include a link to a route in your template via router-link
you have to make sure the alias (ie the name
property) of the route is PascalCase.
If you use plan to use router-link
modify the route to:
{ path: '/employees', component: EmployeesComponent, name: 'Employees'}
Then you can add the link in your template with:
Employees Link
RouterLink
dynamically inserts a href that matches the route path.
Note: Reading the issue/pr it appears this change was made to prevent users from confusing the
binding with the route url
Sources:
Tip:
If you want to simplify your view directives use ROUTER_DIRECTIVES
It includes:
RouterLink
RouterOutlet
Update:
In the near future, RouterOutlet
/
will be renamed to RouterViewport
/
Source:
Update 2:
RouteConfig
property as
has been renamed to name
Source: