[解決済み] Angularのルーターリンクが対応するコンポーネントにナビゲートされない

質問

angular2アプリでのルーティングはうまくいっています。しかし、私はいくつかのルートリンクを作成しようとしています。 これ :

以下は私のルーティングです。

const routes: RouterConfig = [
    { path:'home' , component: FormComponent  },
    { path:'about', component: AboutComponent },
    { path:'**'   , component: FormComponent  }
];

そして、作ったリンクがこちら。

<ul class="nav navbar-nav item">
  <li>
    <a routerLink='/home' routerLinkActive="active">Home</a>
  </li>
  <li>
    <a routerLink='/about' routerLinkActive="active">About this</a>
  </li>
</ul>

私は、それらをクリックすると、対応するコンポーネントにナビゲートすることを期待しますが、それらは何も実行されないのですか？

どうすればいいですか？

そこに表示されているコードは全く正しいです。

このテンプレートを使用するモジュールに RouterModule (RouterLink が宣言されている場所) をインポートしていないことが問題だと思われます。

私も同じような問題を抱えており、この手順がドキュメントに記載されていないため、解決するのに時間がかかりました。

そこで、このテンプレートを使ったコンポーネントを宣言しているモジュールに移動して、追加します。

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

を追加し、それをモジュールのインポートに追加します。

@NgModule({
  imports: [
    CommonModule,
    RouterModule
  ],
  declarations: [MyTemplatesComponent]
})
export class MyTemplatesModule { }

正しいインポート文と同時に、そのルーターリンクを表示する場所も必要であり、それは <router-outlet></router-outlet> 要素も HTML マークアップのどこかに配置し、ルーターがデータを表示する場所を認識できるようにする必要があります。