Angular2 - AUSNAHME: Route config sollte genau eine "Komponente" enthalten

Question

Ich habe zwei einfache Seiten, die ich mit Routing in angular2 navigieren. Aber es sieht aus wie ich die folgende Ausnahme bekomme:

AUSNAHME: Fehler bei der Instantiierung des Routers! (RouterLink -> Router).

ORIGINAL AUSNAHME: Route config sollte genau eine "Komponente", "loader" oder "redirectTo" -Eigenschaft enthalten.

Hier sind die Dateien

page1.ts

import {Component} from 'angular2/core'; 

@Component({ 
    selector: "page1", 
    template: `page 1 goes here.` 
}) 
export class Page1Cmp{} 

page2.ts

import {Component} from 'angular2/core'; 

@Component({ 
    selector: "page2", 
    template: `page 2 goes here.` 
}) 
export class Page2Cmp{} 

app.ts

import {Component} from 'angular2/core'; 
import {bootstrap} from 'angular2/platform/browser'; 
import {ROUTER_DIRECTIVES, RouteConfig, ROUTER_PROVIDERS} from 'angular2/router'; 
import {Page1Cmp} from './page1'; 
import {Page2Cmp} from './page2'; 

@Component({ 
    selector: "app", 
    template: `<a [routerLink]="['Page1']">Page1</a> | <a [routerLink]="['Page2']">Page2</a> 
    <router-outlet></router-outlet> 
    `, 
    directives: [ROUTER_DIRECTIVES] 
}) 

@RouteConfig([ 
    {path: "/page1", name: "Page1", component: Page1Cmp, useAsDefault: true}, 
    {path: "/page2", name: "Page2", component: Page2Cmp} 
]) 
class MyApp{} 

bootstrap(MyApp, [ 
    ROUTER_PROVIDERS 
]); 

ich wieder hergestellt, das Problem auf plunkr here

Irgendwelche Gedanken?

Answer 1

Dieser war ziemlich schwierig und Spaß ...

Ihr Problem sind Ihre Importe, sie betrachten

import {Page1Cmp} from './page1'; 
import {Page2Cmp} from './page2'; 

Sie etwas falsch sehen Sie? Nein, nichts, oder?

Nun nehmen Sie einen Blick auf diese Dateien

page1.ts

export class Page2Cmp{} 

page2.ts

export class Page1Cmp{} 

Haben Sie es jetzt? Ja! Die Klassennamen entsprechen nicht der Datei, in der sie sind: P, also importieren Sie Klassen, die nicht aus jeder Datei existieren.

Sie können also Page1Cmp zu page1.ts und Page2Cmp zu verschieben.

Hier ist Ihre plnkr funktioniert.

Es hat mir tatsächlich eine Minute, um zu sehen, es war sehr gut versteckt: P