如何定义和调用子路由

Question

我在主路由模块中创建子路由时遇到问题。

{ path: 'vehicles/vehicles', component: VehiclesComponent, data: { permission: 'Pages.Vehicles' }, children: [{ path: 'statistic', component: StatisticVehicleComponent }] },

我正在尝试从代码重定向到它：

this.router.navigate(['/app/main/vehicles/vehicles/statistic']).then(() => {
            window.location.reload();
        });

但我总是收到路线不存在的错误消息。

我做错了什么，我应该在其他地方注册路由还是我以错误的方式调用这个路由器？

Answer 1

您可以像这样定义您的路线。将您的父组件移动到子路由的空路径。

{ path: 'vehicles/vehicles', 
    children: [
      { path: '', component: VehiclesComponent, data: { permission: 'Pages.Vehicles' } }
      { path: 'statistic', component: StatisticVehicleComponent }
    ]
}

参考Angular Documentation了解更多信息。

如何定义和调用子路由

How to define and call child route

angular

angular-ui-router