После замечательной статьи о динамической загрузке компонентов:
https://blog.angularindepth.com/here-is-what-you-need-to-know-about-dynamic-components-in-angular-ac1e96167f9e
Я хочу узнать больше об использовании System.import. Автор использует следующий синтаксис для загрузки файла javascript модуля для динамической загрузки.
System.import('../module1.module.js').then((module) => {
this.compiler.compileModuleAndAllComponentsAsync(module.Module1Module)
.then((compiled) => {
const factory = compiled.componentFactories[0];
this.container.createComponent(factory);
});
});
Я понимаю, что system.import используется для динамической загрузки модулей во время выполнения.
И в нашем случае мы предоставляем имя ts файла модуля, но поскольку файл js также будет иметь то же имя, мы можем указать это в параметрах функции импорта.
Но мне было интересно, если мымог бы предоставить общий JS-файл в параметре, который не обязательно содержит этот модуль, но также содержит больше модулей и компонентов. (Эти модули могут поступать из других внешних проектов / библиотек). Затем мы можем предоставить одно из названий модулей, например, следующее и создать компоненты.
System.import('../main-app1.js').then((module) => {
this.compiler.compileModuleAndAllComponentsAsync(module.Module1Module)
.then((compiled) => {
const factory = compiled.componentFactories[0];
this.container.createComponent(factory);
});
});
Я пробовал вышеуказанный подход, но он не работает для меня. Сбой во время выполнения.
core.js:9110 ERROR Error: Uncaught (in promise): Error: No NgModule metadata found for 'undefined'.
Error: No NgModule metadata found for 'undefined'.