Динамически создавать компоненты из одного углового шаблона

Question

Мне было интересно, есть ли способ в angular, где можно генерировать компоненты во время выполнения из общего шаблона?

Например, если у меня есть панель виджетов, где бэкэнд-сервер сообщает мне, сколько виджетов отрисовано, есть ли способ создать компонент для каждого из виджетов и добавить их в качестве дочерних к родительскому?компонент приборной панели?

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

Я смотрел на динамические компоненты в угловых, но там у вас есть предопределенный компонент (например, модальный), который вы можете загружать / выгружать во время выполнения.

Редактировать: я мог бы использовать конструкции ngFor / ngIf, если бы яМне нужно отобразить виджеты, потому что мне нужны компоненты, потому что я хотел бы выполнить кучу других задач, например, настроить наблюдаемые, основываясь на том, какой это виджет.

Answer 1

Что ж, самое простое решение было бы иметь некоторые фиксированные виджеты и просто отображать их, используя данные из вашего бэкэнда и *ngFor и *ngIf, даже если это не совсем красивое решение.

<div class='dashboard'>
    <ng-content *ngFor='let widget of widgets'>
        <ng-content *ngIf='widget.type == 1'><app-widget1></app-widget1></ng-content>
        ....
    </ng-content>
</div>

Также имеется ComponentFactoryResolver , который можно использовать для динамической загрузки компонентов во время выполнения, как описано здесь .Сам не пробовал, поэтому не могу привести пример, но в руководстве приведен пример кода, и, возможно, он соответствует вашим потребностям.