原來的例外：沒有供應商的路由器

Question

我想使用Angular 2.的組件路由器，我已經用一個預先存在的角度1應用程序引導角2應用程序。這裏是我的代碼：

main.ts

import { upgradeAdapter } from './upgrade-adapter'; 
import { ResAppComponent } from './resApp.component'; 
import { appRouterProviders } from './app.routes'; 

angular.module('utdApp').directive('appComponent', upgradeAdapter.downgradeNg2Component(ResAppComponent)); 

upgradeAdapter.bootstrap(document.body,['utdApp'],ResAppComponent,[appRouterProviders]); 

resApp.component.ts

import { Component } from '@angular/core'; 
import { DisclosureComponent } from './disclosure.component'; 
import {ROUTER_DIRECTIVES} from '@angular/router' 

@Component({ 
selector: 'app-component', 
template: ` 
<h1>My angular app</h1> 
<nav> 
<my-app-new></my-app-new> 
<a routerLink="/route1" routerLinkActive="active">Route</a> 

<router-outlet></router-outlet> 
</nav> 
`, 
directives: [ROUTER_DIRECTIVES], 
providers:[DisclosureComponent] 

}) 

export class ResAppComponent{} 

app.routes.ts

import { provideRouter, RouterConfig } from '@angular/router'; 
import { DisclosureComponent } from './disclosure.component'; 

const routes:RouterConfig = [ 

{ 
    path: 'route1', 
    component: DisclosureComponent, 
} 
]; 


export const appRouterProviders = [ 
provideRouter(routes) 
]; 

disclosure.component.ts

import { Component } from '@angular/core'; 
import { ROUTER_DIRECTIVES, provideRouter } from '@angular/router'; 


@Component({ 
selector:'my-app-new', 
template:`<h1>{{title}}</h1>`, 
directives:[ROUTER_DIRECTIVES], 

providers:[provideRouter] 

}) 

export class DisclosureComponent 
{ 
title="Success" 

} 

我的錯誤是一樣的東西：

我似乎無法找出什麼是錯的。關於angular2的組件路由器沒有太多可用的信息。

Answer 1

需要在bootstrap(AppComponent, [appRouterProviders])中提供新路由器，而不是根組件。

providers:[provideRouter] 

應該從DisclosureElement