Question

我有以下路线：

const routes: Routes = [
  {
    path: '',
    component: BlogLayoutComponent,
    children: [
      {
        path: ':pageNumber',
        component: HomeComponent
      },
      {
        path: '',
        component: HomeComponent
      },
      {
        path: 'article/:id',
        component: ArticleComponent
      },
      {
        path: 'articles-by-hashtag/:id',
        component: ArticlesByHashComponent
      },
      {
        path: 'articles-by-category/:id',
        component: ArticlesByCatComponent
      },
      {
        path: 'about-me',
        component: AboutMeComponent
      }
    ]
  }
];

所有路线都可以正常工作，但是我无法使用about-me导航到routerLink页面，就像这样：

<li><a [routerLink]="[ 'about-me' ]">ABOUT ME</a></li>

如果我删除默认参数:pageNumber，那么导航将起作用，否则，about-me链接会将我带到默认路线。

如何使about-me路线有效？老实说，我宁可不要使用router.navigate(...。

Answer 1

您必须像这样更改路线

<li><a [routerLink]="['/about-me']">ABOUT ME</a></li>

然后在pageNumber参数之前添加一些路由。我不确定您对HomeComponent的路线定义是否正确

{
   path: 'something/:pageNumber',
   component: HomeComponent
},

当默认路线在Angular中具有参数时，无法导航到路线

1 个答案: