Dynamically create array of HTML elements with typescript in Angular 2/4 -

i want dynamically add divs using loop typescript in angular. want reproduce following pseudocode in .ts component file:

i: number = 4; arrayofhtmlelements: html elements = [];  in range (1, i):     create div @ index 

i'm assuming slide array of html elements .html component file using:

<li *ngfor="let arrayofhtmlelement of arrayofhtmlelements; let = index">{{i + 1}}: {{arrayofhtmlelements}}</li> 

you should iterate on objects , create inner html in template this:

const heroes = [   { name: 'spiderman' },   { name: 'superman' },   { name: 'superwoman!' } ]  template: `   <ul>     <li *ngfor="let hero of heroes">       <div>{{hero.name}}</div>     </li>   </ul> `