在Angular 2中动态插入组件，知道组件字符串名称

Question

在这种情况下如何在Angular 2+中动态插入组件？

<div *ngFor="let component of components">

</div>

其中components是array中的strings，一个string是单个组件名称。 在这种情况下该如何做？我希望显示数组中的所有组件。

这是组件数组的示例：

components: ['app-item-search-sidebar','app-item-list','app-item-create','app-item-change'];

Answer 1

您可以使用ngSwitch：

<div *ngFor="let component of components" [ngSwitch]="component">
    <div *ngSwitchCase="'child-component-one'">
         <child-component-one></child-component-one>
    </div>
    <div *ngSwitchCase="'child-component-two'">
         <child-component-two></child-component-two>
    </div>
    <div *ngSwitchCase="'child-component-three'">
         <child-component-three></child-component-three>
    </div>
    ... //append other component selectors
</div>