【问题标题】:routerLink is not working in angular 2routerLink 在角度 2 中不起作用
【发布时间】:2017-04-13 14:04:53
【问题描述】:

页面中的路由没有发生。我使用了下面的 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>

路由配置代码是

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

当我点击分页链接中的“1”或“2”时出现以下错误。

ERROR 错误:未捕获(在承诺中):错误:无法匹配任何路由。 URL 段:'review/phrase/NaN' 错误:无法匹配任何路由。网址 段:'review/phrase/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) [角度]

【问题讨论】:

    标签: angular routerlink routerlinkactive


    【解决方案1】:

    试试这样的。

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

    这是它期望输入的方式。 !

    编辑: 此外,您的 html 中没有路由器容器。 将此添加到模板文件的末尾。

    <router-outlet></router-outlet>
    

    【讨论】:

    • @Partha Ghiya:感谢您的回答。它路由到 URL。但是除非我刷新它,否则页面不会加载。你能帮忙吗?
    • @GreenComputers 因为你没有路由器插座。最后将其添加到您的 html 中。 &lt;router-outlet&gt;&lt;/router-outlet&gt;
    • @Partha Ghiya:已添加。但同样的问题。请帮忙。
    • @GreenComputers 与您必须刷新页面相同的问题?你能创建一个 plunkr 什么的吗
    • @Partha Ghiya:如果你有团队查看器软件,我可以分享我的屏幕吗
    猜你喜欢
    • 1970-01-01
    • 2016-12-18
    • 2017-02-23
    • 2019-01-17
    • 2017-04-13
    • 1970-01-01
    • 2016-11-13
    • 2016-05-06
    • 1970-01-01
    相关资源
    最近更新 更多