Question

从测试版升级到RC1后，我遇到了一些路由问题。一些路线工作正常，而其他路线给我以下例外：

Error: Uncaught (in promise): EXCEPTION: Error in :0:0
ORIGINAL EXCEPTION: No provider for Router!
ORIGINAL STACKTRACE:
Error: DI Exception

这是我的app.component.ts：

@Component({
  selector: 'my-app',
  templateUrl: 'app/app.component.html',
  styleUrls: ['app/app.component.css'],
  encapsulation: ViewEncapsulation.None,
  directives: [ROUTER_DIRECTIVES, DROPDOWN_DIRECTIVES, RouterOutlet],
  providers: [
    HTTP_PROVIDERS,
    ROUTER_PROVIDERS,
    StudentService,
    ReportService,
    UserService,
    ClassService,
    PropertiesService
 ]
})

@Routes([
{ // child route
    path: '/admin/...',
    name: 'Admin',
    component: AdministratorComponent
},
{ path: '*', name: 'Home', component: HomeComponent },
{ path: '/filter', name: 'Filter', component: FilterComponent },
{ path: '/profile',      name: 'Profile',  component: ProfileComponent  },
{ path: '/credits', name: 'Credits', component: ReportComponent},
{ path: '/approve', name: 'Approve', component: ApproveComponent},
{ path: '/filter-class', name: 'FilterClass', component: FilterClassComponent},
{ path: '/class', name: 'Class', component: ClassComponent}

])

这是具有子路由

的administrator.component.ts

@Component({
selector: 'my-administrator',
templateUrl: 'app/components/administrator/administrator.component.html',
//styleUrls: ['app/administrator.component.css'],
encapsulation: ViewEncapsulation.None,
directives: [RouterOutlet, ROUTER_DIRECTIVES],
providers: []

})

@Routes([
{path: '/profile/:id', name: 'Profile', component: ProfileComponent},
{path: '/approve/:id', name: 'Approve', component: ApproveComponent},
{path: '/filter', name: 'Filter', component: FilterComponent},
{path: '/filter-class', name: 'FilterClass', component:    FilterClassComponent},
{path: '/class/:id', name: 'Class', component: ClassComponent},
])

我已经包含了下面的html：

<a class="list-group-item" href="javascript:void(0)" [routerLink]="['Home']">Home</a>

路由工作^

<a class="list-group-item" *ngIf="user.isAdmin" [class.active]="getLinkStyle('/admin/')" href="javascript:void(0)" [routerLink]="['Admin', 'Filter']">Student Management<span class="sr-only">(current)</span></a>

路由不起作用^

<a class="list-group-item" *ngIf="!user.isAdmin" [class.active]="getLinkStyle('/profile')" href="javascript:void(0)" [routerLink]="['Profile',{id: userConst.user.studentId}]">My Profile</a>

路由工作^

<a class="list-group-item" *ngIf="!user.isAdmin" [class.active]="getLinkStyle('/credits')" href="javascript:void(0)" [routerLink]="['Credits']">My Credits</a>

路由工作^

<a class="list-group-item" *ngIf="user.isAdmin" [class.active]="getLinkStyle('/filter-class')" href="javascript:void(0)" [routerLink]="['FilterClass']">Class Management</a>

路由不起作用^

Answer 1

不要在每个组件上添加ROUTER_PROVIDERS，只在根组件上添加一次。
/...：'/admin/...'，因为子路由在rc.x中对我不起作用。尝试删除/...
新路由器中的路由没有name。仅path和component（其他人已计划好）
使用新路由器[routerLink]获取路径段列表，而不是名称 [routerLink]="['/admin', 'filter']或[routerLink]="['Admin/Filter']

angular2 RC1有些路由器没有提供商

1 个答案: