Динамические теги ngFor в Angualar2?

Question

[westdp]

Столкнулся с проблемой, есть массив который содержит обекты:

this.dataCell = [
            {"id": "1", "fill": "#D9D9D9", "type": "path", "d": "L111.2,484.7"},
            {"id": "2", "fill": "#FF0000", "type": "polyline", "points": "L327,53.1"},
            {"id": "3", "fill": "#772BA9", "type": "polyline", "points": "407 140"},
            {"id": "4", "fill": "#D9D9D9", "type": "path", "d": "L478.4,97.3"},
            {"id": "5", "fill": "#772BA9", "type": "path", "d": "L576.9,181.1"}
        ];

Реализовать такое знаю как:

<path *ngFor="let item of dataCell">{{item.type}} fill="{{item.fill}} id="{{item.id}}</path>

Но как мне реализовать в зависимости от type в обькте, вставлять тег который хранится в dataCell[i].type?

<app-for-example *ngFor="let item of dataCell" [dataCell]="dataCell">
          <{{item.type}} [fill]="{{item.fill}}"></{{item.type}}>
        </app-for-example>

Answer 1

[Николай]

Используйте ngSwitch: https://angular.io/docs/ts/latest/api/common/index...

Answer 2

[Артем]

Должно быть что такое...

<app-for-example *ngFor="let item of dataCell" [dataCell]="dataCell" [ngSwitch]="item. type">
  <path *ngSwitchCase ="item.type == 'path'" attr.fill="{{item.fill}} attr.id="{{item.id}}></path>
  <polyline *ngSwitchCase ="item.type == 'polyline'" attr.fill="{{item.fill}} attr.id="{{item.id}}></polyline>
</app-for-example>