Question

我的角度路由器需要为父级和子级路由使用相同的组件，但是传递数据以区分父级和子级路由。

当前问题：子路由未从子路由注册任何数据。

定义关系的路由模块段：

{
        path: 'parent-path/:id',
        component: MyComponent,
        children: [{
          path: 'child-path'
          component: MyComponent,
          data: {MY_DATA_KEY: MY_DATA_VALUE},
        }]
},

在角度部分：

constructor(
      //...
      private readonly activatedRoute: ActivatedRoute,
      //...
) {}

ngOnInit() {
   this.activatedRoute.data.subscribe(data => {
      console.log('data', data);  // This prints and empty object //

      /* ... do something with data */
   });
}

当前行为：

击中路线'... / parent-path / some-id'

正常预期行为，没有数据

击中路线'... / parent-path / some-id / child-path'

异常行为，数据仍然为空

注意：：我还尝试了在父级添加数据，该数据确实在两条路由中都已注册。对Angluar来说还比较陌生，因此可以提供任何帮助。预先感谢！

Answer 1

angular的路由器本质上是具有父级和子级的树结构，数据在该树的节点上定义，数据对象存在于定义它们的特定节点上。因此，父路径不会在其自己的“数据”中看到子路径数据，也不会直接看到其父“数据”。但是您可以根据需要从激活的路由访问父/子路由

this.route.parent.data.subscribe(pd => console.log(pd, 'parent data'));

或

this.route.children.forEach(c => c.data.subscribe(cd => console.log(cd, 'child data'));

这是一个演示行为的堆栈闪电战：https://stackblitz.com/edit/angular-s4mffg?file=src/app/app.module.ts

角路由器-子路由的空数据对象

1 个答案: