时间戳

首页 > 解决方案 > 我如何对子组件进行角度路由

angular - 我如何对子组件进行角度路由

问题描述

我正在尝试导航到我的孩子定义的组件，但我的路由器无法识别给定的路由。

路线如下：

在路由器文件中，我定义了如下内容：

const routes: Routes = [
{
    path: "",
    redirectTo: "products",
    component: StandardproductsComponent,
    pathMatch: "full",
    canActivate: [AuthorizedGuardService],
},
{
    path: "products",
    component: StandardproductsComponent,
    resolve: {
        loaded: StandardsResolver
    },
    children: [ 
        {
            path: ":productId/types",
            component: StandardtypesComponent,
            // resolve: {
            //     loaded: StandardTypesResolver
            // },
            // canActivate: [AuthorizedGuardService]
        }
    ]
}];

我将无法这样做，任何人都可以帮助我如何使我的路线可行。我想要这样的路线：v3/products/{productId}/types

标签： angulartypescriptrouting

解决方案

您有 2 条路线指向相同的名称和相同的组件

尝试执行以下操作

const routes: Routes = [
    {
        path: "",
        redirectTo: "products",
        pathMatch: 'full'
    },
    {
        path: "products",
        component: StandardproductsComponent,
        resolve: {
            loaded: StandardsResolver
        },
        children: [
            {
                path: ":productId/types",
                component: StandardtypesComponent,
            }
        ]
    }
];

当然 StandardproductsComponent 必须有

<router-outlet></<router-outlet>

希望这可以帮助！

推荐阅读