Display array in Angular2 template

问题:

My angular2 component has an @Input(): data of type [number,number]. The size of the array is should be determined from the input. How can I now bind the content of this array to a table in html, i.e., the table should be something like this:

<table>
    <tr>
        <td> data[0,0] </td>
        <td> data[0,1] </td>
        ...
    </tr>
    <tr>
        <td> data[1,0] </td>
        <td> data[1,1] </td>
        ...
    </tr>
    ...
</table>

回答1:

You can do this with two *ngFor-Directives:

<table>
    <tr *ngFor="let row of data">
        <td *ngFor="let value of row">{{value}}</td>
    </tr>
</table>

Working Plunkr

回答2:

Short example:

Our array:

array = [[1,2],[3,4],[7,7]];

Our template:

<table>
  <tr *ngFor="let rows of array">
    <td *ngFor="let col of rows">{{ col }}</td>
  </tr>
</table>