如何在Angular2 compiler / cli ngc命令中使用RouterModule.forRoot()

时间:2017-01-04 12:29:06

标签: angular angular2-routing angular2-compiler

假设我有以下appRoutingModule:

export const routes: Route[] = [
  {
    path: '',
    component: ApplicationlistComponent
  }
];

@NgModule( {
  imports: [ ApplicationsModule, RouterModule.forRoot( routes ) ],
  exports: [ RouterModule ],
  declarations: [ApplicationlistComponent]
} )
export class AppRoutingModule {
}

使用 ngc cli命令进行编译时,会出现以下错误:

Error: Error encountered resolving symbol values statically. Calling function 'RouterModule', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol AppRoutingModule in C:/git/mxt-frontend/landing-page-client/src/client/app/app-routing.module.ts, resolving symbol AppRoutingModule in C:/git/mxt-frontend/landing-page-client/src/client/app/app-routing.module.ts

我尝试将其放在导出的const中:

export const routerModule =  RouterModule.forRoot( routes );

但是这会产生这个错误:

Error: Error encountered resolving symbol values statically

使这项工作的解决方法/修复方法是什么?如果我无法将其传递给RouterModule,我该如何定义路由?

我正在使用版本:

"@angular/compiler": "~2.4.0",
"@angular/compiler-cli": "~2.4.0",
"@angular/platform-server": "~2.4.0",
"@angular/router": "~3.4.0"

2 个答案:

答案 0 :(得分:2)

我通过将角度恢复到版本2.3.1来解决这个问题。 看起来它在2.4.0版本中被打破了..

答案 1 :(得分:1)

为什么您的代码既不导入BrowserModule也不导入CommonModule? 你试过这个吗?

@NgModule( { imports: [BrowserModule, ApplicationsModule, RouterModule.forRoot( [ { path: '', component: ApplicationlistComponent }]) ], declarations: [ApplicationlistComponent], bootstrap: [ApplicationlistComponent] } ) export class AppRoutingModule { } 要尝试的另一件事是将路由器的代码放在一个单独的文件中,例如app.routing.ts:

const routes: Routes = path: '',
    component: ApplicationlistComponent

export const routing = RouterModule.forRoot(routes);

和@NgModule:

@NgModule( {
  imports: [BrowserModule, ApplicationsModule, 
           routing
],
  declarations: [ApplicationlistComponent],