각형 라우터 3 routerLink가 작동하지 않습니다.

Question

라우터 3.0.0-alpha.8에서 각도 2.0.0-rc3을 사용하고 있습니다.

나는 다음과 같은 템플릿으로 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로 이동하면 문제가 해결됩니다.

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