Angular 2 place components depending on an array

I'm new to angular 2 and I got stuck... I try to create a board for a boardgame (reversi, board like chess but mono-color) I have a class cellInfo(here I want to hold the information)

constructor(row: number, col: number, stats: boolean[]){
this.row = row;
this.col = col;
this.stats = stats;
}


I have a class courtInfo(here I create an array of cellinfo)

constructor(x: number){
this.x = x;
this.cells = new CellInfo[x];

for(let row: number = 0; row < x; row++){
this.cells[row] = new CellInfo[x];
for(let col: number = 0; col < x; col++){
this.cells[row][col] = new CellInfo(row, col, [false, false, false])
}
}
}


I have a component courtComonent

• 
  in the .ts I create a courtInfo
  
  constructor() {this.round = new CourtInfo(8); }

(I named round cause later I want to refresh this array each round)

• in the html I tried to create a component-object from class cellComponent

<div *ngFor="let cellrow of round.cells">
<div class = row; *ngFor="let cellcol of round.cells[cellrow]">
<div class = col>
<cell></cell>
</div>
</div>
</div>


in the court.component.css I have this:

.row{
--row-hight: 12,5%;
display: table;
width: 100%;
height: var(--row-hight);
}
.col{
display: flex;
width: auto;
height: 100%;
}
cell{
display: flex;
width: 100%;
height: 100%;
}


the CellComponent itself shell be a div which shell (later) draw a circle or not.

But atm this is not working, the cells are not added to the court. I don't know if I had to bind somewhere, I guessed that not cause the array [cells] is a class-intern...

I'm seeking for some hints

Continue reading...