Question

我正在尝试使用typescript在Angular2中创建基于路由器的简单应用程序。我的Angular2版本为2.0.0-rc.4，路由器版本为3.0.0-beta.1

我的路线配置如下 -

App.routes.ts

import { provideRouter, RouterConfig } from '@angular/router';
import { PageNotFoundComponent } from './Shared/pageNotFound.component';
import { Page1Component } from './Pages/Page1/page1.component';
import { Page2Component } from './Pages/Page2/page2.component';

const routes: RouterConfig = [

  { path: 'page1', component: Page1Component },
  { path: 'page2', component: Page2Component },
  { path: '**', component: PageNotFoundComponent }
];

export const appRouterProviders = [
  provideRouter(routes)
];

使用npm start命令运行应用程序时，我收到一个警告（不是错误）。请参阅此screen shot for warning

如何克服此警告？

Answer 1

这似乎是Angular 2路由器文档中的一个空白。希望它能很快赶上来。与此同时，如this answer中所述，Angular 2的最新版本为precompile装饰器添加了@Component选项。根据警告的请求，将其添加到您的应用组件。

@Component({
  selector: 'my-root-app-component',
  template: '...',
  precompile: [PageNotFoundComponent, PlusWhateverElseThrowsAWarning, Etc]
})

Angular 2总是预编译组件（它允许它如此神奇！）但是对于新路由器，您需要指定应该预编译哪些组件。据推测，这样做是为了优化性能，确保只有绝对必要的组件才会在启动时进行预编译。

Answer 2

尝试在主AppComponent中添加以下行 -

  precompile: [Page1Component, Page2Component .... ]

看看这是否有帮助。

如何使用angular2中的简单路由器处理预编译数组警告

2 个答案: