Маршрутизатор Angular2 RC5 3.0.0 - нет ссылки на <a> в компоненте из общей библиотеки

Question

У меня проблема с сгенерированной маршрутизацией в компоненте из общего модуля.

Вот плункер.

В меню навигации 3 ссылки. Когда я нажимаю "Информация", страница отображается правильно, и там должна быть ссылка на " Здоровье". Но Angular не разбирает шаблон и <a> у тега нет добавленного атрибута href,

Тот же HTML-код

<a routerLink="/health">Health</a>

используется как в меню (где он ведет себя правильно), так и в LandingComponent шаблон.

Что и куда я должен импортировать, чтобы обе ссылки работали?

Answer 1

Ваш LandingComponent является частью SharedModule. Таким образом, вы должны импортировать RouterModule в SharedModule, чтобы заставить ссылку работать в вашем LandingComponent, вот правильный код для SharedModule:

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';

import { LandingComponent } from './landing.component';

@NgModule({
    imports: [RouterModule],
    exports: [LandingComponent],
    declarations: [LandingComponent]
})
export class SharedModule { }

Answer 2

Это будет работать, но более обходной, Дмитрий Нехайчик, ответ правильный.

import { Component, Input } from '@angular/core';
import { Router } from '@angular/router';
@Component({
    selector: 'landing',
    template: `
<div class="fgnp-panel">
    <h1>Page: {{pageTitle}}</h1>
    <a link (click)="router.navigate(['/Health'])" routerLinkActive="active">Health</a>
</div>`,
    styles: [`  a:link {text-decoration: none; color: blue;}a:visited {color: #EE9A00;}
                a:hover { text-decoration: underline;cursor: pointer;}`]
})
export class LandingComponent {
    @Input()
    pageTitle: string = '';

    constructor(private router: Router) { }
}