routerLink在角度2中不起作用 [英] routerLink is not working in angular 2

问题描述

页面中没有路由.我在下面使用了HTML和配置代码.

Routing in page is not happening. I have used below HTML and config code.

<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>

路由配置代码为

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

当我在分页链接中单击"1"或"2"时，出现以下错误.

I am getting the below error when i click on '1' or '2' in my pagination link.

错误错误:未捕获(承诺):错误:无法匹配任何路由. URL段:'review/phrase/NaN'错误:无法匹配任何路由.网址 区隔:评论/短语/NaN" 在ApplyRedirects.noMatchError(router.es5.js:1404)[角度] 在CatchSubscriber.selector(router.es5.js:1379)[角度] 在CatchSubscriber.error(catch.js:104)时[角度] 在MapSubscriber.Subscriber._error(Subscriber.js:128)上[角度] 在MapSubscriber.Subscriber.error(Subscriber.js:102)处[角度] 在MapSubscriber.Subscriber._error(Subscriber.js:128)上[角度] 在MapSubscriber.Subscriber.error(Subscriber.js:102)处[角度] 在MapSubscriber.Subscriber._error(Subscriber.js:128)上[角度] 在MapSubscriber.Subscriber.error(Subscriber.js:102)处[角度]

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]

推荐答案

尝试类似的方法.

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

这是期望输入的方式. ！

This is how it expects input. !

另外，您在HTML中没有路由器容器. 将此添加到模板文件的末尾.

Also you dont have router container in your html. Add this at end of template file.

<router-outlet></router-outlet>

这篇关于routerLink在角度2中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！