我们有一个用Angular编写的SPA应用程序,该应用程序利用动态加载路由(与静态定义的路由相对)的优势.
We have a SPA app written in Angular which takes advantage of loading routes dynamically (as opposed to statically defined routes).
随着时间的流逝,这些动态加载的UI组件的数量将越来越多.对于任何给定的客户部署,我们将仅使用一小部分可能的组件.在运行时,组件列表将由数据驱动.因此,我的愿望是获取该组件列表并执行以下操作: -在运行时为每个组件定义一个应用程序路由 -延迟加载该组件
Over time, the number of these dynamically loaded UI components will grow and grow. For any given customer deployment, we will only be using a small subset of the possible components. At runtime, the list of components will be data driven. So my desire is to take that list of components and do the following: - define an application route for each component at runtime - lazy load that component
此问题已在我们应用程序的Angular 1版本中解决(使用ocLazyLoad软件包和angular的$ stateProvider)
It’s a problem that has been solved in the Angular 1 version of our application (using ocLazyLoad package and angular’s $stateProvider)
在Angular2的某些更高Beta版本中,它似乎可以解决(使用AsyncRoutes和router.config方法-请参见技术此处)
It appears to be solvable in some of the later Beta releases of Angular2 (using AsyncRoutes and the router.config method - see technique here)
但是在RC1中,AsyncRoutes和router.config方法似乎已损坏.
But in RC1 that AsyncRoutes and router.config method seems to be broken.
关于在Angular2版本候选中异步加载组件/路由的指南,我发现很少.
I can find very little with respect to guidance for loading components/routes asynchronously in the Angular2 release candidates.
是否有针对最新候选人的典型示例?
Is there a canonical example for doing this with the latest candidates?
推荐答案在新路由器(>= RC.3)中 angular.io/docs/ts/latest/api/router/index/Router-interface.html#!#resetConfig-anchor 可以使用resetConfig
In the new router (>= RC.3) angular.io/docs/ts/latest/api/router/index/Router-interface.html#!#resetConfig-anchor resetConfig can be used
router.resetConfig([ { path: 'team/:id', component: TeamCmp, children: [ { path: 'simple', component: SimpleCmp }, { path: 'user/:name', component: UserCmp } ] } ]);
现在,使用惰性模块实现了延迟加载组件(RC.5).
Lazy loading components is now (RC.5) implemented using lazy modules.
github/angular/angular/issues/11437# issuecomment-245995186 提供了一个 RC.6 柱塞
更多推荐
Angular2 RC和动态路线
发布评论