ncohen ncohen - 3 months ago 100
AngularJS Question

Cannot match route index

Using the last version of angular 2 router (3.0.0-rc.1) and angular 2 (RC5). My router has the following routes:

{ path: 'transport', redirectTo: 'transport/entity-list', pathMatch: 'full'},
{ path: 'transport/entity-list', component: EntityListComponent },
{ path: 'transport/cover-list', component: CoverListComponent },
{ path: 'transport/invoice-list', component: InvoiceListComponent },
{ path: 'transport/damage-list', component: DamageListComponent }


My server (ExpressJS) has the pug library and renders my index as follow:

res.render('index');


I also have the base tag in my index.pug

head
base(href="/")


In
MyComponent
I also import the
ROUTER_DIRECTIVES


When I load the index, everything renders but I get the following error:

Error: Uncaught (in promise): Error: Cannot match any routes: 'index'


From what I understand, angular's router is trying to route index but doesn't see it in the path. So I've tried to add
index
as a path but get:

Error: Uncaught (in promise): Error: Cannot find primary outlet to load 'MyComponent'


I have two questions:


  1. What am I doing wrong and how can I get rid of this error?

  2. How can I get index load
    transport/entity-list
    from the beginning?


Answer

You're missing index path on your routing, so what you did is correct.

For your other issue:

Error: Uncaught (in promise): Error: Cannot find primary outlet to load 'MyComponent'

Do you have this defined on your template?

<router-outlet></router-outlet>