Angular2：テンプレートを反復する方法

Question

私は、以下のように、これらのコンポーネント、クラスBとCを別のテンプレートで取得しました。

@Component({}) 
export abstract class A {} 

@Component({ 
    template: `BBBBBB` 
}) 
export class B extends A{} 

@Component({ 
    template: `CCCCCC` 
}) 
export class C extends A{} 

私の主なコンポーネントでは、Aの配列を繰り返してHTMLのテンプレートを挿入する必要があります。

@Component({ 
    template: ` 
    <div> 
    ...???... 
    </div> 
    ` 
}) 

export class MrModul { 
    anArray: A[] = Array(); 
    constructor(){ 
     ... 
     //filling up the Array 
     ... 
    } 
} 

だから私は '???'適切なテンプレートで、私は配列を反復処理している間、私は実際にどのように知っていません。私がセレクタを使用する場合、私は実際にどのセレクタを使うべきかわかりません。しかし、私が*ngForを使用する場合、私はどの属性を使うべきか分かりません。
あなたは私を助けることができますか？どうも！

ボーナス情報： 目標はウィジェットシステムのようなものです。ランダムなタイプを選択して追加することができます - それを呼び出す - ウィジェット、それらは新しいdivに入れられます。新しいウィジェットを格納するための配列です。

Answer 1

<ng-content *ngFor="let item of anArray"> 
    <my-a *ngIf="item.compo == 'a'></my-a> 
    <my-b *ngIf="item.compo == 'b'></my-b> 
    <my-c *ngIf="item.compo == 'c'></my-b> 
</ng-content>