儿童的Angular 5路由器插座不起作用

时间:2018-10-23 15:04:50

标签: angular routing outlet

我正在从事角度项目,但不能为子路线添加“出口”。 这些是主模块已经调用的路由参数,但是我不知道为什么它不起作用。

这是主要路线

const routes: Routes = [
            {path: '', component: ContainerComponent},
            {path: 'search', component: SearchComponent},
            {path: 'sign-in',  loadChildren: './../signIn_Module/sign-in.module#SignInModule'},
            {path: 'sign-up', loadChildren: './../signUp_Module/sign-up.module#SignUpModule'},
            {path: 'home', loadChildren: './../home_Module/home.module#HomeModule'},
            {path: 'user', loadChildren: './../profile_Module/profile.module#ProfileModule'},
            {path: 'training', loadChildren: './../Training_Module/training.module#TrainingModule'},

            {path: '**', redirectTo: '', pathMatch: 'full'}
];

这是包含问题的路线

const trainingRoutes: Routes = [
  {path: '', component: TrainingComponent, children: [
     {path: 'title', component: TitleComponent, outlet: 'training_content'},
     {path: 'image', component: ImageComponent, outlet: 'training_content'},
     {path: 'description', component: DescriptionComponent, outlet: 'training_content'},
     {path: 'file', component: FileComponent, outlet: 'training_content'},
     {path: 'requirement', component: RequirementComponent, outlet: 'training_content'},
     {path: 'details', component: DetailsComponent, outlet: 'training_content'},
     {path: '**', redirectTo: 'title', pathMatch: 'full'}
  ]},
  {path: '**', redirectTo: '', pathMatch: 'full'}
];

1 个答案:

答案 0 :(得分:0)

将第一个路由更改为全路径

 {path: '', component: ContainerComponent},

 {path: '', component: ContainerComponent, pathMatch: 'full'},