ネストされたルートではナビゲートできません - angular2.rc3

Question

コンフィグレーションによってナビゲートできません。ネストしたルートを新しいルータに設定します。 "エラー：キャッチされていない（約束しています）：エラー：いずれの経路にも一致しません： 'todos'"。私はどこが間違っているのか分かりません。誰も私がこの問題を解決するのを助けることができますか？前もって感謝します。

Answer 1

あなたはこのような何かを置く必要があります。

<...> 
import { PLATFORM_DIRECTIVES } from '@angular/core'; 
<...> 
bootstrap(<...> 
    , [APP_ROUTER_PROVIDERS , <...> ]); 
<...> 

2）その後、アプリのルーティングを定義し、VARでエクスポート：

//our root app component 
import {Component} from '@angular/core'; 
import {ROUTER_DIRECTIVES, RouterConfig, Router} from '@angular/router'; 

import {LoginComponent} from './login'; 
import {TodosComponent} from './todos.ts'; 

export const AppRoutes: RouterConfig = [ 
    { 
    path: "login", 
    component: LoginComponent, 
    name:"Login" 
    }, 
    { 
    path: 'todos', 
    component: TodosComponent, 
    name:"Todos" 
    } 
    , 
    { 
    path: "", 
    redirectTo: "/todos" 
    }, 
] 

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

Answer 2

1）のように、あなたのメインの出発アプリの何かを追加します、APP_ROUTER_PROVIDERS（最初に必要なすべてのコンポーネントをインポートする必要があります）、

import { provideRouter, RouterConfig } from '@angular/router'; 
<...> 
export const routes: RouterConfig = [ 
    { path: 'comp1', component: Component1 }, 
    ...Component1Routes, //if you want to have this in a separate file 
    { 
     path: 'comp2', 
     component: Component2, 
     'children': [ 
      { path: '', component: comp2 }, 
      { path: 'new', component: comp2new }, 
      { path: 'edit/:id', component: comp2edit } 
     ] 
    } 
]; 
<...> 
export const APP_ROUTER_PROVIDERS = [ 
    provideRouter(
     routes 
     //, { enableTracing: true } 
    ) 
]; 
... 

3）また、あなたの一番上のコンポーネントにルータディレクティブを追加する必要があります。

import { ROUTER_DIRECTIVES } from '@angular/router'; 

4）いずれかの子コンポーネントで使用すると、ルータ& ActivatedRoute含まれている必要がありますビューに

import { Router, ActivatedRoute } from '@angular/router'; 

5）あなたは使用してリンクを追加することができます

<a [routerLink]="['comp1']"> Comp 1</a> 

あなたがここに実行している例を見つけることができます：http://embed.plnkr.co/ER0tf8fpGHZiuVWB7Q07/ またはhttp://plnkr.co/edit/Zd0qmavTzedtimImAgfQ?p=preview

私はそれは私がそれのために[plunker]（http://plnkr.co/edit/l30dbnSP8P6CCFfQmpfn?p=preview）を作成しました