角型ルータ3 routerLinkが動作しません

Question

私は角度2.0.0-rc3とルータ3.0.0-alpha.8を使用しています。

は、私は次のテンプレートを BookListComponentを持っている：

<nav> 
    <a routerLink="/new-book">New Book</a> 
</nav> 

<ul> 
    <li *ngFor="let book of books">{{ book.name }}</li> 
</ul> 

そしてここBookListComponentそのものです：

import { Component, OnInit } from '@angular/core'; 
import { BookService } from '../book.service'; 
import { ROUTER_DIRECTIVES } from '@angular/router'; 

@Component({ 
    moduleId: module.id, 
    selector: 'app-book-list', 
    templateUrl: 'book-list.component.html', 
    styleUrls: ['book-list.component.css'], 
    providers: [ROUTER_DIRECTIVES, BookService] 
}) 
export class BookListComponent implements OnInit { 
    books: any; 

    constructor(private bookService: BookService) {} 

    ngOnInit() { 
    this.bookService.getList() 
     .subscribe(response => this.books = response.json()); 
    } 

} 

だけでなく、リンクが訪問した場合、/new-bookルート（に私を取ることはありません。 "手動で"正常に動作します）、 "リンク"もリンクではない - それは黒いテキストです。

どのようにリンクを動作させることができますか？

Answer 1

私はproviders下ROUTER_DIRECTIVESを持っているが、それはdirectives下にする必要：

<router-outlet></router-outlet>

私はリファレンスとしてこれを使用します。 directivesに移動すると問題が解決しました。

は、ここに私の新しいBookListComponentです：

import { Component, OnInit } from '@angular/core'; 
import { BookService } from '../book.service'; 
import { ROUTER_DIRECTIVES } from '@angular/router'; 

@Component({ 
    moduleId: module.id, 
    selector: 'app-book-list', 
    templateUrl: 'book-list.component.html', 
    styleUrls: ['book-list.component.css'], 
    providers: [BookService], 
    directives: [ROUTER_DIRECTIVES] 
}) 
export class BookListComponent implements OnInit { 
    books: any; 

    constructor(private bookService: BookService) {} 

    ngOnInit() { 
    this.bookService.getList() 
     .subscribe(response => this.books = response.json()); 
    } 

} 

Answer 2

ルーターアウトレットタグがホストのビューHTMLにないことを確認してください。
https://angular.io/docs/ts/latest/guide/router.html