Загрузка angular компонента библиотеки ivy через импорт с путем к модулю в виде строки - PullRequest
Новая
       8

Загрузка angular компонента библиотеки ivy через импорт с путем к модулю в виде строки

0 голосов
/ 30 января 2020

Я использую Ivy последний r c кандидат на данный момент.

Вариант использования: я хочу предоставить несколько модулей, которые компилируются отдельно, загружаемые через оператор импорта во время выполнения, без использования loadchildren из модуля маршрутизатора .

Контекст: я создал библиотеку, называемую узлами, через "ng generate library node". «Узлы сборки ng» генерируют под dist желаемые связки et c. Пока ничего особенного.

В моем приложении я хочу создать экземпляр NodesComponent следующим образом:

const modulePath = '/Users/modules/nodes/nodes.umd.js'; return await import (modulePath) .then (...)

Это не работает, поскольку компилятор Ivy почему-то не распознает модуль, загружаемый по требованию.

При вызове

import ('/ Users / modules / node / node.umd. js'). Затем (...) все работает как положено.

Вопрос:

Это так? Можно ли загрузить произвольный файл модуля из местоположения с импортом БЕЗ, указав modulePath @ время компиляции?

В Ivy должна быть возможность лениво загружать модули из любого места, не указывая их во время компиляции.

1 Ответ

0 голосов
/ 09 апреля 2020

Мне нужно было зарегистрировать классы в словарь по строке ClassName для динамически загружаемых c компонентов и модулей. После поиска дней на ivy я обнаружил, что использование $ {} для извлечения имени из объекта json и замены текста в строке импорта const путем зацикливания массива с определением имени класса загружает компоненты lazy и dynamici c , Массив виджетов может быть отправлен из бэкэнда, поэтому он становится действительно динамичным c. Компоненты, которые находятся в виджетах и ​​каталоге модулей, будут скомпилированы как отдельные файлы чанков javascript. Поместите функции в службу и вызывайте их, когда вам нужно загрузить определенный c компонент или модуль, отправив имя этого модуля / компонента в массив 

initwidgetscomponents(){
      const widgets = [{type:'bar'},{type:'xxx'}];
      widgets.map(widget => {
           import(`../widgets/${widget.type}/${widget.type}.component`).then(x => {
            this.register(widget.type,x.default);
             });
        });
  }

initmodules(){
    const modules = [{name:'svg'},{name:'relationmanagement'}];
    modules.map(module => {
         import(`../modules/${module.name}/${module.name}.module`).then(x => {
             console.log(x);
           });
      });
}

, затем добавьте в раздел include tsconfig каталоги как 

"./src/lib/widgets/**/*.component.ts",
"./src/lib/modules/**/*.module.ts",
"./src/lib/modules/**/*.action.ts",
"./src/lib/modules/**/*.model.ts",
"./src/lib/modules/**/*.component.ts",
"./src/lib/modules/**/*.state.ts"
...