链接到子路由器出口

我在子路由模块中定义了以下路由

const routes: Routes = [
  {
    path: ''  ,
    component: DashboardComponent
  },
  {
    path: 'application',
    component: ApplicationComponent,
    children: [
      {
        path: '',
        component: ApplicationStep1Component,
        outlet: "appSteps"
      },
      {
        path: 'step1',
        component: ApplicationStep1Component,
        outlet: "appSteps"
      },
      {
        path: 'step2',
        component: ApplicationStep2Component,
        outlet: "appSteps"
      }
    ]
  }
];

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

父路由看起来像这样

const  routes = [
     {
       path: 'applications',
       loadChildren: './applications/applications.module#ApplicationsModule'
     }
  ];
@NgModule({
  imports: [
    CommonModule,
    RouterModule.forRoot(routes)
  ],
  exports: [RouterModule],
  declarations: []
})

在我的仪表板组件中,我有一个导航栏,我想在其中链接到嵌套面板中的组件 router-outlet 路由器出口

  <div class="row">
    <div class="col text-center">
      <a class="btn btn-primary" [routerLink]="['step1']">Step 1</a>
    </div>
    <div class="col text-center">
      <a class="btn btn-primary" [routerLink]="['step2']">Step 1</a>
    </div>
  </div> <!-- end .row -->

  <router-outlet name="appSteps"></router-outlet>

当 applications/application 路线被激活,Step1组件被正确显示,但是如果我尝试使用导航条,我最终会在控制台中出现错误 Error: Cannot match any routes. URL Segment: 'applications/application/step1' .

我尝试过不同的方法来达到目的 step1 ,但仍然以相同的错误结束。