Angular 更好的创造方式；“子/嵌套”；有角度的路线？

我的问题似乎微不足道，但我真的不知道在网上哪里可以找到答案

让我们看一个显示3种水果列表的组件。每种水果都有专门的成分。 列表URL为localhost:4200/水果列表。 我希望能够导航到localhost:4200/fruit list/banana并显示banana组件，但只显示这个组件，而不是像子路由那样替换列表组件中的“路由器出口”

---

一个简单的解决方案是单独声明“水果清单”、“水果清单/香蕉”、“水果清单/苹果”。。。路线，但我不觉得这很优雅。是否有一种方法可以简单地使水果路由成为列表路由的子路由，但在尝试转到子路由时只显示水果组件，而不将其显示在列表组件内部。

这在无组件路由中是可能的。像这样：

export const routes = [
  { path: 'fruit-list', children: [
    { path: '', component: ListComponent },
    { path: 'banana', component: BananaComponent },
    { path: 'apple', component: AppleComponent }
  ]}
];

---

如果可能的话，我想要的是某种语法，类似于子路由（您只需将子数组添加到定义父路由的对象中，然后添加相对于子路由的对象），但不要让嵌套组件显示在父路由中，而只显示它们自己。也许你的解决方案是对的，我只是不知道如何使用它。你不明白什么？我已经更新了我的答案，但是有了一个更符合你需要的解决方案。我对Angular很陌生，所以我不知道如何使用你的解决方案。我用路由参数解决了我的“问题”，这也让我避免在随路由变化的服务中使用变量，而您的解决方案将我指向了路由参数，所以谢谢！