Angular 2延迟加载技术
我已经用Angular 1写了一个很大的应用程序，用requireJS和AMD写了一个用于延迟加载和结构化的应用程序。该应用程序不使用路由，但应用程序的一部分，如HTML，css和Javascript (angular模块)是延迟加载的。
现在我想改用Angular 2，我正在寻找最好的延迟加载技术，用于HTML，css和JS (angular)内容，它不依赖于路由，也不依赖于数千种不同的javascript框架。
因此，延迟加载路由组件似乎非常简单：http://blog.mgechev.com/2015/09/30/lazy-loading-components-routes-services-router-angular-2
但是，如果没有路由，您将如何完成该场景呢？你会推荐像webpack这样的吗，还是我应该保留requireJS？有没有类似于angular 2的OClazyload？或者，即使没有任何框架，它也能以某种方式与Angular 2一起工作吗？
我是“保持简单”的朋友，我真的想让它尽可能的小和简单。
谢谢!
回答 3
Stack Overflow用户
发布于 2016-04-23 02:44:51
Angular 2基于web组件。最简单的方法(如你所说的“保持简单”)就是使用路由和组件。您也可以通过在html中使用指令来简单地加载组件。例如：
@Component({
selector: 'my-component', // directive name
templateUrl: './app/my.component.html',
directives: []
})
export class MyComponent {}
@Component({
selector: 'root-component', // directive name
directives: [MyComponent],
template: '<my-component></my-component>',
})
export class myComponent {}如果您将模板修改为动态包含<my-component>，它将动态加载组件。这不是最佳实践。
有一个用于angular 2的dynamic component loader，但这并不像使用路由或指令那么简单。它将创建一个组件的实例，并将其附加到位于另一个组件实例的组件视图内的视图容器。
有了它，你可以使用：
@Component({
selector: 'child-component',
template: 'Child'
})
class ChildComponent {
}
@Component({
selector: 'my-app',
template: 'Parent (<child id="child"></child>)'
})
class MyApp {
constructor(dcl: DynamicComponentLoader, injector: Injector) {
dcl.loadAsRoot(ChildComponent, '#child', injector);
}
}
bootstrap(MyApp);生成的DOM：
<my-app>
Parent (
<child id="child">Child</child>
)
</my-app>还有另一个选项(查看上面的angular2链接)，您可以有选择地提供提供者来配置为此组件实例提供的注入器。
希望这能有所帮助。
Stack Overflow用户
发布于 2017-01-11 01:35:46
在angular 2的最新版本中，我们可以使用loadchildren属性来执行延迟加载。例如：{ path：'Customer'，loadChildren：'./customer.module#Customer2Module?chunkName=Customer‘}，
在上面的例子中，我使用了webpack捆绑(angular 2路由器加载器)+Anguar2路由来延迟加载模块。
Stack Overflow用户
发布于 2017-01-09 17:48:54
https://medium.com/@daviddentoom/angular-2-lazy-loading-with-webpack-d25fe71c29c1#.582uw0wac
假设我们的应用程序中有两个页面，“主页”和“关于”。有些人可能永远不会到达about页面，所以只将about页面的负载提供给真正需要它的人是有意义的。这就是我们将使用延迟加载的地方。
https://stackoverflow.com/questions/35361787
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号