Creating a table with nested lists in Angulardart


I’m trying to build a table representing a List<List<int>> in Angulardart.

This is the content of my template file:

        <tr *ngFor="#row of cells">
            <td *ngFor="#cell of row">
                <input type="number" #cell (keyup)="0"/>

And the list is initialized like this:

class Grid {
    const GRID_SIZE = 9;
    List<List<int>> cells = new List(GRID_SIZE);

    Grid() {
        cells.forEach((x) => x = new List(GRID_SIZE));

However, in the rendered HTML I only see 9 <tr> empty tags, with no <td>s inside.

What am I missing?


Turns out the issue was in the grid initialization: the correct initialization code to have it filled with lists of zeroes is

cells.fillRange(0, cells.length, new List.filled(GRID_SIZE, 0));

The initialization code in the question only filled the main list with GRID_SIZE nulls.

Answered By – Raibaz

Answer Checked By – Marilyn (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *