angular2 webpack AsyncRoute new name

Question

我需要一个using angular2-webpack-starter

我想添加一个新的AsyncRoute。但是有一个例外

export const routes: RouterConfig = [
  { path: 'detail', component: 'Detail', canActivate: [ WebpackAsyncRoute ] },
  { path: 'foo', component: 'Foo', canActivate: [ WebpackAsyncRoute ] },
];
export const asyncRoutes: AsyncRoutes = {
  'Detail': require('es6-promise-loader!./+detail'),
  'Foo': require('es6-promise-loader!./+foo')
};
export const prefetchRouteCallbacks: Array<IdleCallbacks> = [
  asyncRoutes['Detail'],
  asyncRoutes['Foo']
];

我甚至不能更改路由名。

export const routes: RouterConfig = [
  { path: 'detail', component: 'Foo', canActivate: [ WebpackAsyncRoute ] },
];
export const asyncRoutes: AsyncRoutes = {
  'Foo': require('es6-promise-loader!./+detail'),
};
export const prefetchRouteCallbacks: Array<IdleCallbacks> = [
  asyncRoutes['Foo'],
];

发生了什么事?

Answer 1

实现如下:

[
  new AsyncRoute({
      path: '/'
      , name: RouterService.CONTROL_CENTER_ROUTE
      , loader: () => new Promise((resolve: any) => {
          (<any>require).ensure(['control-center.component']
          , (require: any) =>
            resolve(require('control-center.component').ControlCenterComponent));
      })
      , useAsDefault: true
    })
  , new AsyncRoute({
    path: '/login'
    , name: RouterService.LOGIN_ROUTE
    , loader: () => new Promise((resolve: any) => {
        (<any>require).ensure(['login.component']
        , (require: any) =>
          resolve(require('login.component').LoginComponent));
    })
  })
];

有关更多信息，请参阅本博客此处输入链接描述