Angular2部分动态组件方法

Question

我需要构建一个动态html页面（内容&订单是在运行时生成的）。 我将根据服务器响应（json）生成角度为2的组件。

我看到我可以采取ComponentFactoryResolver方法。它看起来很笨重，而且很小巧。

当时我想以下的想法：

dynamic.component.html：

<div *ngFor="let item of dynamicItems"> 
 
    <div [ngSwitch]="item.type"> 
 
    <template [ngSwitchCase]="component1"> 
 
     <component1 [data]="item.data"></component1> 
 
    </template> 
 
    <template [ngSwitchCase]="component2"> 
 
     <component2 [data]="item.data"></component2> 
 
    </template> 
 
    <template [ngSwitchCase]="component3"> 
 
     <component3 [data]="item.data"></component3> 
 
    </template>¯ 
 
    <template [ngSwitchCase]="component4"> 
 
     <component4 [data]="item.data"></component4> 
 
    </template> 
 
    </div> 
 
</div>

dynamicItems是从服务器接收阵列。

使用此方法的含义是什么？ 这是不好的做法吗？

Answer 1

觉得这是很好的

<div *ngFor="let item of dynamicItems"> 
<component1 *ngIf="item.type=='component1'" [data]="item.data"></component1> 
<component2 *ngIf="item.type=='component2'" [data]="item.data"></component2> 
<component3 *ngIf="item.type=='component3'" [data]="item.data"></component3> 
<component4 *ngIf="item.type=='component4'" [data]="item.data"></component4> 
</div>