尽管在路线上定义了指定的路由器插座，Angular 2路线仍会加载到顶级路由器插座中

Question

在这里你可以看到问题：

admin-area-models-models应该以名称models-content呈现在路由器插座中，而是放在与父模块相同的路由器插座中，即admin-area-models。这是因为我在admin-area-models路由器中得到了这个没有任何意义：

const routes: Routes = [
  {
    path: '',
    component: ModelsComponent
  },
  {
    path: 'brands',
    loadChildren: '../pages/+models-brands/models-brands.module#ModelsBrandsModule',
    outlet: 'models-content'
  },
  {
    path: 'models',
    loadChildren: '../pages/+models-models/models-models.module#ModelsModelsModule',
    outlet: 'models-content'
  },
  {
    path: 'models/:id',
    loadChildren: '../pages/+model/model.module#ModelModule',
    outlet: 'models-content'
  }
];

@NgModule({
  imports: [
    ComponentsModule,
    SharedModule,
    RouterModule.forChild(routes)
  ],
  declarations: [
    ModelsComponent
  ]
})

export class ModelsRouterModule {}

为什么当我定义了一个特定的插座时，它仍然会将它变成顶级插座？

修改

如果我改变以便路线是儿童的话就这样定义：

const routes: Routes = [
  {
    path: '',
    component: ModelsComponent,
    children: [
      {
        path: 'brands',
        loadChildren: '../pages/+models-brands/models-brands.module#ModelsBrandsModule',
        outlet: 'models-content'
      },
      {
        path: 'models',
        loadChildren: '../pages/+models-models/models-models.module#ModelsModelsModule',
        outlet: 'models-content'
      },
      {
        path: 'models/:id',
        loadChildren: '../pages/+model/model.module#ModelModule',
        outlet: 'models-content'
      }
    ]

  }
];

然后没有一条路线有效。 ModelsComponent位于/admin/dashboard/models，因此在第一个配置中，我显示所有路径都可以像这样访问：

/admin/dashboard/models
/admin/dashboard/models/(models-content:brands)
/admin/dashboard/models/(models-content:models)
/admin/dashboard/models/(models-content:models/5) // Any number

但是在尝试使用children的配置时，我无法再访问这些路由中的任何一个。建议在延迟加载的文件中使用此语法是错误的。

Answer 1

由于您admin-area-models-models的{​​{1}}不是孩子，因此您的路线必须是：

admin-area-models

您希望在const routes: Routes = [ { path: '', component: ModelsComponent, children: [ { path: 'brands', loadChildren: '../pages/+models-brands/models-brands.module#ModelsBrandsModule', outlet: 'models-content' }, { path: 'models', loadChildren: '../pages/+models-models/models-models.module#ModelsModelsModule', outlet: 'models-content' }, { path: 'models/:id', loadChildren: '../pages/+model/model.module#ModelModule', outlet: 'models-content' } ] } ]; 内的admin-area-models内呈现辅助路线，但这是您宣布路线的方式：

这就是你想要渲染它们的方式：

你显然需要改变你的逻辑，因为你的路线不是兄弟姐妹，他们是<router-outlet name="models-content">的孩子