Routing angular2: Nothing appears

0
votes

I'm trying to implement basic routing with Angular2 but without success :-D Actually, I don't even have an error, I just get nothing on the page (which does not help me to debug the issue ^^). Here's what I did:

  • Bootstrap "ROUTER_PROVIDERS" from 'angular/router'
  • Define the routes in the main component (see below).
  • Add a "router-outlet" element in the template of the main component.
  • The main component implements "ngOnInit" and uses the router to redirect the user to the route named "Company".

The routes:

@RouteConfig([
    { path: '/company', component: CompanyComponent, name: 'Company' },
    { path: '/missions', component: MissionComponent, name: 'Mission' }
])

When I access my page, I'm correctly redirected to "/company", so it looks like the routes are correctly defined, but still, I don't see anything. I tried to add the "company" element in the main component template to see if this component was OK, and when I do that, it appears correctly, so I don't think that's a component related issue.

I checked the live example from angular tutorial and the only difference I see is that they use "Routes" decorator instead of "RouteConfig". When I do that, WebStorm only found "Routes" in "angular2/alt_router" and it does not work anyway (I have an error saying Angular does not find my routes)...

It just looks like if the "router-outlet" is not found/filled up, but I have no idea why.

I'm using angular2 beta 17

1
routingangular
kind of difficult to say anything without AppComponent, CompanyComponent and MissionComponent code – Picci

1 Answers

1
votes

The difference you have between the documentation you are reading and the code you are using is the angular version. If you go to the site of Angular2 Routing & Navigation link you can see in bold it states:

This chapter is a work in progress.

It describes the release candidate Component Router which replaces the beta router.

The version you are using is the old one, for which the documentation can be found here

There you can check the sample app to see what's different from your implementation.

However I would suggest you upgrade to the RC version of angular2 instead of using the beta version.