动态加载组件

• demo访问地址：https://bigbear713.github.io/ngx-dyn-load/

动态加载一个不属于任何一个NgModule的组件（angular9）

• 可以动态加载一个不属于任何一个NgModule的组件；
• 但是组件中想用其它组件、指令等就没法用，比如ngIf,ngFor;
• 每次动态加载的组件实例都是不同的，不管是在同一个模块中，还是不同模块中；
• 多次加载时，组件的js文件只会加载一次，不会加载多次；
• 动态加载的组件可以正常获取根模块的全局服务实例；

动态加载一个模块

原理

• 路由懒加载的实现思路；

说明

• 可以动态加载一个模块。
• 导入后，模块中的组件不用导出就可以动态加载到页面上。
• 模块内部可以有多个组件，指令，并在内部使用；
• 模块可以有服务，包括模块级服务和组件级服务；
• 如果每次加载显示模块中的组件时，都是先动态加载模块，那么每次模块都是新创建的，因此模块级的服务实例是不同的；
• 如果第二次加载模块中的组件时，是直接加载组件，而不是重新加载编译模块，那么模块和模块级的服务不会重新实例化；
• 每次动态加载的模块内组件实例都是不同的，不管是在同一个模块中，还是不同模块中；
• 多次加载时，模块的js文件只会加载一次，不会加载多次；
• 动态加载的组件可以正常获取根模块的全局服务实例；
• angular8下aot编译成production模式下的代码后，会报错；只有在jit模式下编译才不会报错。这是因为导入的模块要在运行时才能正确获取，jit模式为运行时编译，而 aot是预编译，所以jit下可以正常运行，而aot下会报错；
• 通过DI的工厂提供商模式，动态引入模块，就可以在aot模式下正常动态加载模块组件；
• angular9下，aot编译也能正常使用；