Angular 角度路由使子路径整页接管

我正在创建一个angular应用程序，它有一个订单历史记录，将显示所有以前的订单。选择一个后，它将打开一个新页面，并向您显示该特定订单的详细信息。由于2将被链接，我已经创建了订单项作为订单历史组件的子项，如下所示

{
    path: 'history', component: OrderHistoryComponent,
    children: [
      {
        path: ':orderNo',
        component: OrderItemComponent,
      },
    ]
  },

但结果是这样的：

路径是

localhost:4200/#/history/order1

如您所见，order item组件位于order history组件的下面。有没有办法让它作为一个孩子的路线，但仍然有它接管了整个页面？ 我认为这将是评估信息的最佳方式，因为我将获得订单历史json，并将使用特定的订单号来显示有关该订单的信息

---

谢谢

您可以将订单的登录页作为子项添加到“历史”路线，并使历史路线本身成为无组件路线，如下所示：

{
    path: 'history',
    children: [
      {
        path: '',
        component: OrderHistoryComponent,
      },
      {
        path: ':orderNo',
        component: OrderItemComponent,
      },
    ]
  },

<router-outlet></router-outlet>

---

然后路径

localhost:4200/#/history

将显示

OrderHistoryComponent

，

localhost:4200/#/history/order1

将显示

OrderItemComonent
OrderHistoryComponent中有细微的变化，您必须放置路由器出口，因此，每当访问OrderHistoryComponent，然后它们将在OrderHistoryComponent中存在的路由器出口中呈现

路线很好

       {
    path: 'history', component: OrderHistoryComponent,
    children: [
      {
        path: ':orderNo',
        component: OrderItemComponent,
      },
    ]
  },

在OrderHistoryComponent模板中，必须进行如下更改：

{
    path: 'history',
    children: [
      {
        path: '',
        component: OrderHistoryComponent,
      },
      {
        path: ':orderNo',
        component: OrderItemComponent,
      },
    ]
  },

<router-outlet></router-outlet>

OrderHistory组件.html
除了路由器出口，您编写的任何代码都使用*ngIf指令绑定它

<div
  *ngIf="router.url == '/history'"
>
Your order table will be here i think
</div>


我想您的点菜台会在这里
这似乎是一个很好的解决办法。json的数据是否会从
OrderHistoryComponent
传递到
OrderItemComponent
？我以前尝试过将数据传递给组件（未链接），但保存数据总是很棘手，尤其是在刷新时。理想情况下，我不希望每次有人刷新时都执行get请求，如果他们在：orderNo页面上，则不会将数据从
OrderHistoryComponent
传递到
OrderItemComponent
。我建议这两个组件是同级的，因此，
OrderHistoryComponent
或
OrderItemComponent
处于活动状态。您好，这就是我目前拥有它的方式，因此我在
order history.component.html
文件中有
，但问题是，
order item.component.html
显示在订单历史记录下，而我希望它是一个完整的页面