Как визуализировать разные элементы, используя ngFor на основе условия angular2

Question

Мне нужно динамически создать некоторый компонент html с помощью ngFor. Необходимо отображать различные элементы, такие как текстовое поле, выбрать и т. Д., Основанные на значениях формы json.

Я знаю, как это сделать в javascript, используя для цикла и если условие. но что является альтернативой угловому 2?

, например

for(var i=0;i<data.length;i++){ 
    if(data.type=="textbox"){ 
     $('#container').append(//textbox snippet) 
    } 

    if(data.type=="select"){ 
     $('#container').append(//select snippet) 
    } 
} 

, что является альтернативой для этого в угловой 2? любая помощь очень ценится.

Answer 1

Вы можете использовать директиву *ngIf.

Например:

<div *ngIf="(data.type == 'textbox')"> 
<!--textbox snippet here--> 
</div> 

или

<input *ngIf="(data.type == 'textbox')" type="text" value="" /> 

Вот documentation о *ngIf директива