Question

我有一个具有以下路由的模块：

{
    path: '',
    component: PagesComponent,
    children: [
      {
        data: { test: 'snoop' },
        path: 'dashboard',
        loadChildren: './modules/dashboard/dashboard.module#DashboardModule',
      },
      {
        data: { test: 'dogg' },
        path: 'admin', 
        loadChildren: './modules/admin/admin.module#AdminModule' 
      }
    ]
  }

我想做的就是将一些数据传递到PagesComponent组件，具体取决于您已加载的延迟加载模块。

所以，在我的PagesComponent中，我想要这样的东西：

constructor(private route: ActivatedRoute) {
    this.route.data.subscribe(data => {
      console.log(data);
    });
  }

然后data参数将包含在根目录中定义的数据。

我知道我可以轻松地从延迟加载的模块组件本身中的路由中检索数据，但是是否有可能在主机组件（即PagesComponent）中获取此数据？

背景：我想这样做，以便可以根据您当前所在的页面在菜单中显示不同的数据。

Answer 1

延迟加载和simple路由数据之间的区别在于您必须更深入地研究。

constructor(route: ActivatedRoute) {
  route.url.subscribe(() => {
    console.log(route.snapshot.firstChild.firstChild.data);
   });
}

Angular-在路由到延迟加载的模块时将数据传递到主机组件

1 个答案: