Angular 8-子routerLink不起作用

问题描述

我想从一个页面导航到另一页面,从一个组件导航到另一组件:

const routes: Routes = [
  {
    path: '',component: UploadPageComponent,children: [
      {
        path: 'frameworks',component: FrameworksSceneComponent,pathMatch: 'full',children: [
          {//doesn't work
            path: 'questionnaire',component: QuestionnaireComponent,},],{
        path: 'documents',component: DocumentsSceneComponent,{//works
        path: 'questionnaire',];

@NgModule({
  imports: [RouterModule.forChild(routes)],exports: [RouterModule],})
export class UploadRoutingModule {
}

我的模板(FrameworksSceneComponent):

 <a [routerLink]="['questionnaire']">aaaaaaaaaaaaaaaaaaaa</a>

但这有效(FrameworksSceneComponent):

<a [routerLink]="['/private/upload/questionnaire']">bbbbbbbbbbbbbbbbbbbbbbbbbbbbb</a>

我的嵌套链接怎么了?为什么在点击aaaaaaaaaaaaaaaaaa之后将我重定向到我的主页。另一方面,链接bbbbbbbbbbbbbbbb可以工作,但是在这种情况下,该链接不是子链接

解决方法

实现嵌套路线的方式,在<router-outlet>中寻找FrameworksSceneComponent.html。尝试如下实施。不知道为什么要导航到主页。

  routes: Routes = [
    {
      path: "",children: [
        {
          path: "",component: UploadPageComponent
        },{
          path: "frameworks",children: [
            {
              path: "",component: FrameworksSceneComponent,pathMatch: "full"
            },{
              //should  work
              path: "questionnaire",component: QuestionnaireComponent
            }
          ]
        },{
          path: "documents",component: DocumentsSceneComponent,pathMatch: "full"
        },{
          //works
          path: "questionnaire",component: QuestionnaireComponent,pathMatch: "full"
        }
      ]
    }
  ];