2016-08-16 7 views
8

Ich habe ein Problem mit dem neuen Router Angular 2 RC5 (Router-Version ist RC1).Angular 2 RC5: Kein Provider für Router

ist hier das Protokoll ich von der Entwickler-Konsole erhalten:

EXCEPTION: Error in /templates/app.component.html:2:0 
ORIGINAL EXCEPTION: No provider for Router! 

Hier ist, was mein app.modules.ts wie folgt aussieht:

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { RouterModule } from '@angular/router'; 
import { AppComponent } from './components/app.component'; 
import { routing } from './app.routes'; 

@NgModule({ 
    declarations: [AppComponent], 
    imports:  [BrowserModule, RouterModule, FormsModule, HttpModule, routing], 
    bootstrap: [AppComponent], 
}) 
export class AppModule {} 

Hier meine boot.ts Datei ist:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
import { AppModule } from './app.module'; 

platformBrowserDynamic().bootstrapModule(AppModule); 

Meine app.routes.ts Datei ...

import { Routes, RouterModule } from '@angular/router'; 

// Components 
import { HomeComponent } from './components/home.component'; 

const routes: Routes = [ 
    // Root 
    { path: '/', name: 'Home', component: HomeComponent, useAsDefault: true}, 
]; 

// - Updated Export 
export const routing = RouterModule.forRoot(routes); 

... und meine app.component.ts Datei:

import { Component, ViewContainerRef } from '@angular/core'; 

@Component({ 
    selector: 'app', 
    templateUrl: '/templates/app.component.html' 
}) 

export class AppComponent { 
    viewContainerRef: any; 

    public constructor(viewContainerRef:ViewContainerRef) { 
     // You need this small hack in order to catch application root view container ref 
     this.viewContainerRef = viewContainerRef; 
    } 
} 

Gibt es etwas, was ich bin hier fehlt?

+1

"useAsDefault" ist keine gültige Eigenschaft mehr. Ich würde auch das '/' auf der path-Eigenschaft entfernen und zu Ihrer index.html-Datei hinzufügen. –

+1

Der Name der Route muss ebenfalls entfernt werden. – SudarP

Antwort

9

Innen app.routes.ts Datei:

Dieses Import Zustand

import { ModuleWithProviders } from '@angular/core'; 

als

export const routing: ModuleWithProviders = RouterModule.forRoot(routes); 

Diese funktionieren sollte.

+0

Hey @EmmanuelScarabin Hinzufügen von ModuleWithProviders hat nicht für mich behoben. Ich habe 'Kein Provider für Router!' Fehler, sobald ich das -Tag in der app.component.html – SudarP

+1

@SudarP hinzufüge, sollten Sie auch überprüfen, ob Sie nicht "router-deprecated" in einer Ihrer Komponenten verwenden. Das war der zweite Grund, der dieses Problem für mich verursacht hat. –

+0

@EmmanuelScarabin, Vielen Dank, das hat es behoben. – SudarP

Verwandte Themen