Dynamically create table of object in Angular 2
<p>I need to dynamically create table of object in angular 2/typescript</p>

<p>Create array of objects</p>

<pre><code>export class AppComponent {
  gameBoard= GAMEBOARD;
}

var size=10;//will be for user enter
var GAMEBOARD=[];
var x=0;
for(var i=0;i&lt;size;i++){
for (var j=0; j &lt; size; j++) {
  if (!GAMEBOARD[i]) {                 
      GAMEBOARD[i] = [];              
  }
  GAMEBOARD[i][j]=new GameField(x);
  x++;
}}
</code></pre>

<p>Use in template:</p>

<pre><code>&lt;tr *ngFor="let x of gameBoard"&gt;
  &lt;game-field *ngFor="let field of gameBoard[x]" [field]="field" &gt;&lt;/game-field&gt;
&lt;/tr&gt;
</code></pre>

<p>Try to input:</p>

<pre><code>@Component({
  selector: 'game-field',
//  inputs:['field'],
template: '&lt;td &gt;{{field.id}}&lt;/td&gt;',
  styleUrls: ['./app.component.css']
})
export class GameFieldComponent{
@Input() field: GameField;
}
</code></pre>

<p>How to put all object from GAMEBOARD into table?</p>

<p>(I'm a newbie in web development and Stackoverflow so please for indulgence)</p>