dynamicznie generowana tabele w Angular 2

Witam,

Ma ktoś może pomysł w jaki sposób w Angular 2 wygenerować tabelę dla zadanej wielkości.
Oto co próbuję zrobić:

    size: number = 10;//zmienna którą docelowo zamierzam pobierać od użytkownika
  gameBoard: GameField[]=GAMEBOARD;

}

var GAMEBOARD: GameField[] = Array();
for (var i=0; i < size*size; i++) {
  GAMEBOARD[i] = new GameField(i);
}
 

Czyli pobieram rozmiar tabeli N, tworzę tablicę obiektu GameField o wielkości N*N, każdy obiekt przyjmuje id kolejnej iteracji.
I teraz potrzebuję wygenerować tabelę o N-kolumn i N-wierszy. Czyli dla N=3 końcowy html wyglądałby tak:

<tr>
  <td id="0"></td><td id="1"></td><td id="2">
</tr>
<tr>
  <td id="3"></td><td id="4"></td><td id="5">
</tr>
<tr>
  <td id="6"></td><td id="7"></td><td id="8">
</tr>
 

Każde ma przyjąć id = gameField.id;

Tak wygląda klasa GameField:

 
export class GameField{
  id:number;
rate:number;
player:number;

constructor(id:number, player?:number){
  this.id=id;
  this.player=player || 0;
}
}

Jakieś pomysły?

Rozkminiłem, sam sobie odpowiem - może komuś się przyda.

Tak generuje tablice:

 
size = N //

var GAMEBOARD=[];
var x=0;
for(var i=0;i<size;i++){
  //var GAMEROW: GameField[] = Array();
for (var j=0; j < size; j++) {
  if (!GAMEBOARD[i]) {                 // *** Added
      GAMEBOARD[i] = [];               // *** Added
  }
  GAMEBOARD[i][j]=new GameField(x);
  x++;
}
//GAMEBOARD[i]=GAMEROW;

}

a tak wygląda template:

 
  <tr *ngFor="let x of gameBoard">
    <td *ngFor="let field of x">
       <game-field [field]="field"></game-field>
    </td>
  </tr>