Angular 无法导航到子路径答案

【问题标题】：Angular not able to navigate to child routeAngular 无法导航到子路径
【发布时间】：2017-10-05 14:11:38
【问题描述】：

我无法直接前往子路线。我的 url 是 http://localhost:4201/home/profile 但路由器跟踪以 url: '/home' 而不是 url: '/home/profile' 开始

路由器事件：NavigationStart platform-browser.es5.js:1028 NavigationStart(id: 1, url: '/home') platform-browser.es5.js:1028 NavigationStart {id: 1, url: "/home"}

const feedsRoutes: Routes = [
    {
        path: '',
        component: HomeComponent,
        children: [
            { path: 'home', redirectTo: '', pathMatch: 'full' },
            { path: '', loadChildren: '../feeds-home/feeds-home.module#FeedsHomeModule' },
            { path: 'business', loadChildren: '../business-home/business-home.module#BusinessModule' },
            { path: 'people', loadChildren: '../people-home/people-home.module#PeopleModule' },
            { path: 'profile', loadChildren: '../profile-home/profile-home.module#ProfileModule' },
            { path: 'settings', component: SettingsComponent, data: { title: 'Settings' } }
        ]
    }
];

这是因为将子路由加载为模块吗？

【问题讨论】：

您如何尝试导航到子路线？请添加代码
ProfileModule中定义了哪些路由？
profile 不是 home 的 chikd 路线。看起来 localhost:4201/profile 是你想要的
如果您正在寻找嵌套路由，请使用 angular ui route 而不是 angular route。

标签： angular angular-router angular-router-loader

【解决方案1】：

尝试使用 '/home/profile' 在数组中显式创建一个路由条目，并将该条目放在 { path: 'home', redirectTo: '', pathMatch: 'full' } 之前。这是因为 Angular 从头到尾读取它们，并且只要任何条目评估为真，就会退出。否则，在任何情况下都会导航到“家”而不是“家/个人资料”。

【讨论】：