打开带有角度 5 的 url 的子路由答案

【问题标题】：Open child route with url in angular 5打开带有角度 5 的 url 的子路由
【发布时间】：2018-01-11 15:59:35
【问题描述】：

我已经定义了一些路线

export const ContainerRoutes: Routes = [
    {
        path: 'container',
        component: containerComponent,
        children: [
            ...FirstRoutes,
            ...SecondRoutes
        ]
    }
];

第一：

export const FirstRoutes: Routes = [
    {
        path: 'first',
        component: FirstComponent
    }
];

第二：

export const SecondRoutes: Routes = [
    {
        path: 'second',
        component: SecondComponent
    }
];

容器组件显示在路由器出口和子组件本身中。它的孩子也在路由器插座中。

因此，在导航到第一个和第二个组件时一切正常。但是当我想通过 url (localhost:3000/#/parent/container/second) 打开第二个时，它总是重定向到localhost:3000/#/parent/container/first。

如何实现它导航到第二个组件？

【问题讨论】：

标签： angular angular-ui-router

【解决方案1】：

我解决了。

我的错误是我导航到容器的 ngOnInit 方法中的第一个页面，因为我希望它作为第一页。

将容器路由改为

export const ContainerRoutes: Routes = [
    {
        path: 'container',
        component: containerComponent,
        children: [
        {
            path: '',
            redirectTo: 'first',
            pathMatch: 'full'
        },
            ...FirstRoutes,
            ...SecondRoutes
        ]
    }
];

在 OnInit 中删除导航解决了我的问题。

【讨论】：