Angular 2 - 子路线答案

【问题标题】：Angular 2 - Child routeAngular 2 - 子路线
【发布时间】：2016-12-10 23:36:17
【问题描述】：

angular 2 路由有问题，我尝试了很多方法，但仍然有错误消息。我得到了这个网址： /project/:projectId 。项目页面有路由器插座，可以访问这两个网址： /project/:projectId/设置 /project/:projectId/add-card

所以我的问题是当我的网址在/project/:projectId/add-card 上时。我尝试使用this.router.navigate(['./', 'setting']); 访问我的设置页面我还有：

无法匹配任何路由：'setting'(...)

我真的不明白如何从代码中访问它。

这是我父母的路线：

const PROJECT_ROUTES = [
    { 
        path: ':id', 
        CanActivate: [AuthGuard], 
        component: ProjectDetailComponent ,
        loadChildren: './../menu/menu.module#MenuModule',
        resolve: {
            project: ProjectResolver
        }
    },
    { 
        path: '', 
        CanActivate: [AuthGuard], 
        component: ProjectContainerComponent, 
        pathMatch: 'full' 
    }
]

这是我的子路线：

const MENU_ROUTES = [
    { path: 'setting', component: MenuSettingComponent },
    { path: 'add-card', component: MenuAddCardComponent},
    { path: '', redirectTo: 'setting' },
];

我的代码表单切换到设置页面：

onOpenMenu() {
    console.log('navigate to setting');
    this.router.navigate(['./', 'setting']);
    this.menuService.menuEvent.emit(true);
}

感谢您的帮助

【问题讨论】：

标签： angular routing angular-ui-router

【解决方案1】：

我认为您需要添加另一个 . 否则您将导航到 /project/:projectId/add-card/setting

对于相对导航，还需要通过当前路线。

constructor(private route:ActivatedRoute){}

this.router.navigate(['../', 'setting'], {relativeTo: this.route});

【讨论】：