2016-09-02 1 views
0

私はabgular2 RC5のルーティング機能を試しています。以下のコードを見てください。角2 RC5例外:エラー:未知(約束事): 'HomeComponent'を使用してコンポーネントを解決できない

app.component.ts

import { Component,HostBinding } from '@angular/core'; 
import { ROUTER_DIRECTIVES } from "@angular/router"; 

@Component({ 
selector: 'my-app', 
template: ` 
<h1>My First Angular 2 App </h1> 
<router-outlet></router-outlet> 
` 
}) 
export class AppComponent {} 

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

usercomp.ts

@Component({ 
selector: 'user-comp', 
template: `  
<h1>USER COMPONENT</h1> 
` 
}) 
export class UserComponent {} 

homecomponent.ts

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

@Component({ 
moduleId: module.id, 
selector: 'home-component', 
template: ` 
<h1>Home Component</h1> 
` 
}) 
export class HomeComponent {} 

app.module.ts私はHomeComponを輸出しようとした

import { NgModule }  from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { Component } from '@angular/core'; 
import { AppComponent } from './app.component'; 
import { routing } from './approuter' 
import { ROUTER_DIRECTIVES } from '@angular/router' 
import { HomeComponent } from './homecomponent' 
import { UserComponent } from './usercomp' 

@NgModule({ 
    imports:  [ BrowserModule,routing ], 
    declarations: [ AppComponent,HomeComponent,UserComponent ], 
    bootstrap: [ AppComponent ] 
    }) 
export class AppModule { } 

approuter.ts

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

    const APP_ROUTES:Routes = [ 
    { 
    path:'user', 
    component:'UserComponent' 
    }, 
    { 
    path:'', 
    component:'HomeComponent' 
    } 

    ]; 

    export const routing = RouterModule.forRoot(APP_ROUTES); 

ERROR

enter image description here

entコンポーネントとUserComponentホームコンポーネントはどこでもこのコードを削除することはできません。 RC4で、それは罰金、古い道を働いたが

+0

あなたは 'approuter.ts'を追加することができapprouter – Godfather

+0

のための実装を提供してください? –

+0

申し訳ありません私の悪い更新.. – Nomad

答えて

2
import { RouterModule,Routes } from '@angular/router' 
    import { HomeComponent } from './homecomponent'; 
    import { UserComponent } from './usercomp'; 

    const APP_ROUTES:Routes = [ 
     { 
      path:'user', 
      component: UserComponent 
     }, 
     { 
      path:'', 
      component: HomeComponent 
     } 
    ]; 

    export const routing = RouterModule.forRoot(APP_ROUTES); 

コンポーネントがどのコンポーネントタイプを受け入れ、私が見て、私が間違っていたときに私に知らせてください、ここでやった何が間違って..わからない、クラス参照をチェックhere

+0

私はすでにそれらをapp.module.tsファイルにインポートしました... – Nomad

+0

試してみてください:) – Godfather

+0

私はすでにどこでもそれをインポートしようとしました。 – Nomad

0

私はあなたがデフォルトルートにpathMatchを追加する必要があると思う:

{ path: '', redirectTo: '/home', pathMatch: 'full' }, 
{ path: 'home', loadChildren: './app/home/home.module#HomeModule' } 
関連する問題