子ルートを持つ任意のルートを照合して、新しい角度2 RC1ルータはできません

Question

ApplicationComponent

import { Component } from '@angular/core'; 
import {Router, ROUTER_DIRECTIVES, Routes, ROUTER_PROVIDERS} from '@angular/router'; 
import {SchoolyearsComponent} from "./schoolyear/schoolyears.component"; 

@Component({ 
    directives: [ROUTER_DIRECTIVES], 
    providers: [ 
    ROUTER_PROVIDERS 
    ], 
    templateUrl: './app/application.component.html', 
    styleUrls: ['./app/application.component.css'] 
}) 
@Routes([ 
    { 
    path: '/', 
    component: SchoolyearsComponent, 
    }, 
]) 
export class ApplicationComponent {} 

SchoolyearsComponent

import { Component } from '@angular/core'; 
import { Routes, ROUTER_DIRECTIVES } from '@angular/router'; 
import { SchoolyearsHomeComponent } from './schoolyears.home.component'; 
import { CreateSchoolyearComponent } from './create.schoolyear.component'; 

@Routes([ 
    { 
     path: '', 
     component: SchoolyearsHomeComponent, 
    }, 
    { 
     path: '/create', 
     component: CreateSchoolyearComponent 
    } 
]) 
@Component({ template: `<router-outlet></router-outlet>`, directives: [ROUTER_DIRECTIVES]}) 
export class SchoolyearsComponent { 
} 

schoolyears.component.html

<h3>Schoolyears</h3> 

<div> 
<a [routerLink]="['/create']">Create</a> 
</div> 

<table> 
    <tr *ngFor="let s of schoolyears" (click)="createSchoolyear()"> 
     <td>{{s.id}}</td> 
     <td>{{s.name}}</td> 
     <td>{{s.startDate}}</td> 
     <td>{{s.endDate}}</td> 
    </tr> 
</table> 

私はrouterLinkを「作成」をクリックすると、私はこのエラーを取得：

EXCEPTION: Error: Uncaught (in promise): Cannot match any routes. Current segment: 'create'. Available routes: ['/']. 

エラーがなぜロードされていない子のルートですか？ /createルートが利用可能なルートの配列にないのはなぜですか？

Answer 1

を使用した場合の角への最近の変更は、ルータコンポーネントをロードしない更新

これは、新しいV3-beta.2ルータにはもう関係ありません。

オリジナル

変更

@Routes([ 
    {path: '', component: SchoolyearsHomeComponent}, 
    {path: '/create', component: CreateSchoolyearComponent} 
]) 

ルートの順

@Routes([ 
    {path: '/create', component: CreateSchoolyearComponent}, 
    {path: '', component: SchoolyearsHomeComponent}, 
]) 

には現在、重要です。 最も特定のルートが最初に来て、最も特定のルートが最後に来るべきです。 これは既知の問題であり、間もなく修正する必要があります。

Answer 2

あなたは、アプリケーションのコンポーネントには、このような何かルータを注入する必要があります。このコンポーネントに関連付けられているテンプレートは<router-link>ディレクティブを使用しない場合に

export class AppComponent { 

    constructor(private router: Router) {} 

} 

これは通常必要とされています。唯一<router-outlet>

Answer 3

先頭の '/'を削除する必要があります。新しいルータがそれを処理します。

@Routes([ 
    {path: 'create', component: CreateSchoolyearComponent}, 
    {path: '', component: SchoolyearsHomeComponent}, 
]) 

Answer 4

@Routesに記載されている経路の順番がわかります。最も具体的なルートが最初に来て、最後に最小のルートが最後に来るようにする必要があります。これであなたの@Routesをこれに変更します。