Angular 有角度的7懒散与儿童的孩子

我可能很难清楚地表达这个问题，但我确实有一个StackBlitz来帮助我

注意，懒散地加载“用户”

app.routes.ts

//import { NgModule } from '@angular/core';
import { Routes } from '@angular/router';
import { SecureComponent } from './layouts/secure.component';
import { HelloComponent } from './hello.component';

//SECURE
export const SECURE_ROUTES: Routes = [
{ path: '',
  component: HelloComponent,
  data: {
  }
},

//Lazyloading
{ path: 'users',
  data: {
  breadcrumb: 'Users',
},
loadChildren: './users/user.module#UserModule' }
];

export const routes: Routes = [
 { path: '', component: SecureComponent, data: { title: 'Secure Views' }, 
 children: SECURE_ROUTES },

];

这是可行的，但是

用户路径。ts

import { Routes } from '@angular/router';
import { UsersComponent } from './users.component';
import { UserComponent } from './user/user.component';
import { UserTwoComponent } from './user/user-two.component';

export const UserRoutes: Routes = [

  { path: '',
  component: UsersComponent,
  children: [
    {
      path: 'user',
      component: UserComponent,
      data: {
        breadcrumb: 'New'
      },
      children: [
        {
          path: 'user2',
          component: UserTwoComponent,
          data: {
            breadcrumb: 'New2'
          }
        }
      ]
    }
   ]
  }
];

因此，如果单击按钮，您将看到问题。也就是说，路由是正确的（用户/用户），但它不加载“用户组件”，而是显示“用户s组件”。为什么我不知道？

在渲染子路由的任何目标组件的模板中必须有一个

---

UsersComponent

和

UserComponent

都没有

来呈现其他路由。

有三个问题：

在users.component.ts中，您需要进行一个小的修改

toUser() {
   this.router.navigate(['user'], {relativeTo: this.route});
}

这需要告诉angular将您路由到相对于当前路径的特定路径

在user.component.ts中也是如此

toUserTwo() {
   this.router.navigate(['user2'], {relativeTo: this.route});   
}

要使这两个点都起作用，您需要将

ActivatedRoute

注入相应的构造函数中。您需要从

@angular/router

接下来，您需要在user.component.html以及users.component.html中添加以下内容

<router-outlet></router-outlet>

这是在父模板中渲染子管线所必需的

---

如果您需要查看它的工作示例，请参阅下面的示例

当然。加油！你不在的时候我做了一个小编辑。确保将

添加到用户和用户。HTML请将此标记为已接受，如果它解决了您的问题。如果人们花时间去审查网站外的源代码，他们应该得到一些赞扬。嘿，我不想让用户一“进入”用户组件？我可以在编辑模式下看到你的stackblitz吗？为了看代码…只是为了更清楚一点。我想从用户->用户一->用户二开始，只显示各自的模板。希望这是有道理的。话虽如此，我不明白如何才能做到这一点。