Angular 2 Router跳过redirectTo并改为使用子路由

时间:2016-09-11 07:42:56

标签: angular angular2-routing angular2-router3

我现在一直在修改RC6,希望最终路由到嵌套的子组件可以开箱即用。好吧,没有这样的运气。我现在看到的效果是,默认路由的redirectTo被忽略,而Angular直接转到第一个子组件。

import { Route, RouterModule } from '@angular/router';
import { LandingPageComponent } from 'src/landing-page.component';
import { DepartmentModule } from 'src/department/department.module';

const routes: Route[] = [
  { path: '', redirectTo: 'landing-page', pathMatch: 'full' },
  { path: 'landing-page', component: LandingPageComponent },
  { path: 'department', loadChildren: () => DepartmentModule }
];

export const appRoutingProviders: any[] = [];
export const routing = RouterModule.forRoot(routes, {enableTracing:true});

您应该考虑输入任何网址都不会将我带到landing-page,但不会,Angular选择department的原因超出了我。

从那时起,一切都按预期工作,然后我可以导航到子路径

import { Route, RouterModule } from '@angular/router';
import { DepartmentComponent } from './department.component';
import { DepartmentDetailsComponent } from './department-details.component';

const departmentRoutes: Route[] = [
  { path: '', component: DepartmentComponent },
  { path: ':id', component: DepartmentDetailsComponent }
];

export const departmentRouting = RouterModule.forChild(departmentRoutes);

这里奇怪的是,我需要

<a [routerLink]="['../..']">

导航1级备份。可能两个问题都是相关的。

有没有人知道我错过了什么? plnkr可以在这里找到。

1 个答案:

答案 0 :(得分:4)

您只需要从导入从AppMoule的@NgModule())中删除 DepartmentModule ,如下所示,

imports: [ BrowserModule, MdButtonModule, 
           RouterModule, routing]         //<---removed DepartmentModule declaration  

工作http://plnkr.co/edit/qoZ3YCwSz0mQ5o974Dt0?p=preview