2016-04-04 8 views
0

Ich versuche, die Route funktioniert aber bekommen folgenden Fehler. Mein Ziel ist es, die Standardkomponente beim Laden der Seite zu laden und dann, wenn der Benutzer aus der Navigation klickt, können mehr Routen geladen werden.AUSNAHME: Fehler bei der Instanziierung des Routers! (RouterLink -> Router)

Zuerst versuche ich, den Standardrouter zu laden, aber diese folgenden Fehler zu bekommen. Im Moment behielt ich den Router Link und RouterOutlet beide in app.component.ts.

EXCEPTION: Error during instantiation of Router! (RouterLink -> Router). 
ORIGINAL EXCEPTION: Component for route "/home" is not defined, or is not a class. 

meine app Komponente ist wie hier ist

import {Component} from 'angular2/core'; 
import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from 'angular2/router'; 
import {ACCORDION_DIRECTIVES, DROPDOWN_DIRECTIVES, Collapse} from "ng2-bootstrap/ng2-bootstrap"; 
import {CORE_DIRECTIVES} from "angular2/common"; 
import {MyAppComponent} from "./components/myapp.component"; 
import {RouterLink} from "angular2/router"; 
import {RouterOutlet} from "angular2/router"; 


@Component({ 
    selector: 'my-app', 
    template:`<a [routerLink]="['Home']">Heroes</a> 
     <router-outlet></router-outlet><myapp></myapp>`, 
    directives:[ACCORDION_DIRECTIVES, DROPDOWN_DIRECTIVES, CORE_DIRECTIVES, 
     RouterLink,Collapse, ROUTER_DIRECTIVES, MyAppComponent, RouterOutlet], 
    providers:[ROUTER_PROVIDERS] 
}) 

//Router configuration 
@RouteConfig([ 
    { 
     path: '/home', 
     name: 'Home', 
     component:'HomeComponent', 
     useAsDefault: true 
    } 
]) 
export class AppComponent { } 

Meine main.ts wie diese

import {bootstrap} from 'angular2/platform/browser'; 
import {AppComponent} from './app.component'; 
import {ROUTER_PROVIDERS} from "angular2/router"; 

bootstrap(AppComponent,[ROUTER_PROVIDERS]); 

sieht Wenn jemand weiß, was falsch in meinem Code dann lass es mich wissen ..

+0

entfernen ROUTE_PROVIDERS von der Komponente. –

+0

Muss ich aus der App-Komponente entfernen? – user3739018

+0

Ja, Sie sollten es nur in Ihrem Bootstrap haben. –

Antwort

0

providers:[ROUTER_PROVIDERS] aus allen Komponenten entfernen. In ROUTER_PROVIDERS nur

bootstrap(AppComponent, [ROUTER_PROVIDERS]) 
+0

bereits von @Eric im Kommentar gesagt;) –

0

Zuerst tun, wie Eric sagte,

Dann denke ich, das Problem ist mit HomeComponent. Sobald Sie eine Route in RouteConfig, definieren, müssen Sie alle definierten Routenkomponenten importieren.

Also ich denke, das Ihr Problem beheben soll,

import {HomeComponent} from 'HomeComponent path'; 
Verwandte Themen