Angular 5是否可以加载在编译时未知但在运行时动态的模块/组件?
我想这可能无法使用webpack,但可能使用system.js?
编辑:
整个想法是构建一个基于插件的应用程序,其中各个插件被放入插件文件夹中,angular将自动选择它,而不必重新编译和部署整个角度应用程序。插件是独立的功能。当然有路线导航等意味着一旦角度理解有一个新的插件,它应该添加一些动态导航,以便用户能够导航到插件等。
答案 0 :(得分:2)
您可以查看动态组件加载:https://angular.io/guide/dynamic-component-loader
它允许您在运行时动态添加组件。
答案 1 :(得分:2)
嗯,虽然涉及复杂性,但可以尝试一下。取决于你的代码库我猜。路由器公开GHI
属性,保存它的当前配置,以及config
方法重置配置。你可以从那里开始,然后即时添加组件。
但是,组件必须是可访问的。也许是动态创建的,如另一个答案所述。或者,您的配置可能包含以下内容:
resetConfig(routes: Routes)
你必须以某种方式得到pluginPath和pluginName - 也许按惯例计算它,也许是一个小的'得到这个的后端帮助程序,可能有预先配置并已加载或类似的数组。我还假设你有一个非常好的测试系统,以确保你的插件兼容"。最后,教webpack / systemjs如何准备好模块。总而言之,这并非不可能,但它涉及一些基础工作。
那就是说,Angular 6就在角落里,并且随之而来的是Angular Elements。元素将提供一种方法来将您的模块编译为Web组件和" export"它们,以便它们可以在任何地方使用(不一定在Angular应用程序中)。想想jQuery插件 - 你需要加载一个基础constructor(private router: Router) {}
private addPlugin(routePath, pluginName, pluginPath) {
const currentConfig = this.router.config;
currentConfig.push({
path: routePath,
loadChildren: `precompiled-modules/${pluginPath}#${pluginName}`,
});
this.router.resetConfig(currentConfig);
}
,但除此之外你不再考虑它,你只需要使用你的新元素。它与Angular Elements类似 - 您导出基本上是Web组件的东西。有一个"装载机" part(jquery.min.js等价物)和你的Element包。但是,您的组件只是另一个HTML节点,具有属性,属性,绑定,事件,您不再关心,就像您不关心输入一样。
值得等待,看看并自己决定。