router2がアングル2で動作していません

Question

ページのルーティングが行われていません。私はHTMLと設定コードの下で使用しました。

<nav aria-label="Page navigation"> 
    <ul class="pagination pagination-plain"> 
     <li> 
     <a href="review/words" aria-label="Previous"> 
      <span aria-hidden="true">&laquo;</span> 
     </a> 
     </li> 
     <li [routerLinkActive]="['active']"> 
     <a [routerLink]="review/words">1</a> 
     </li> 
     <li [routerLinkActive]="['active']"> 
     <a [routerLink]="review/phrase">2</a> 
     </li> 
     <li> 
     <a href="javascript:void(0)" aria-label="Next"> 
      <span aria-hidden="true">&raquo;</span> 
     </a> 
     </li> 
    </ul> 
    </nav> 

ルーティング設定コードは、私は私は私のページネーションリンクに「1」または「2」をクリックし、以下のエラーを取得しています

const appRoutes: Routes = [ 
    { 
    path: '', 
    component: IndexComponent, 
}, 
{ 
    path: 'index', 
    component: IndexComponent, 
}, 
{ 
    path: 'review/words', 
    component: WordsComponent, 
}, 
{ 
    path: 'review/phrase', 
    component: SentenceComponent, 
} 
]; 

です。

ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'review/phrase/NaN' Error: Cannot match any routes. URL Segment: 'review/phrase/NaN' at ApplyRedirects.noMatchError (router.es5.js:1404) [angular] at CatchSubscriber.selector (router.es5.js:1379) [angular] at CatchSubscriber.error (catch.js:104) [angular] at MapSubscriber.Subscriber._error (Subscriber.js:128) [angular] at MapSubscriber.Subscriber.error (Subscriber.js:102) [angular] at MapSubscriber.Subscriber._error (Subscriber.js:128) [angular] at MapSubscriber.Subscriber.error (Subscriber.js:102) [angular] at MapSubscriber.Subscriber._error (Subscriber.js:128) [angular] at MapSubscriber.Subscriber.error (Subscriber.js:102) [angular]

Answer 1

このようなものを試してください。

<a [routerLink]="['review/words']">1</a> 

これは入力の仕方です。 ！

編集： また、あなたのhtmlにルータコンテナがありません。 テンプレートファイルの最後に追加します。

<router-outlet></router-outlet> 

Answer 2

私はあなたの問題は、あなたがこのテンプレートを使用してモジュールに（RouterLinkが宣言されているところである）RouterModuleをインポートしていないことであると思われます。

私は同様の問題がありました。この手順はドキュメントに記載されていないため、解決には時間がかかりました。

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

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

は、例えば、あなたのモジュールの輸入に追加

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