Angular2模板中的显示阵列

2017-03-06 45 views 0 likes

我的angular2组件有@Input(): data类型[number,number]。数组的大小应该从输入中确定。我怎么能现在这个数组的内容结合到HTML中的表，即表应该是这样的：Angular2模板中的显示阵列

<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>

来源

2017-03-06 EluciusFTW

如果数组的长度，从输入确定的，则可以定义像'@input（）的数据类型的数据：数[];'。你可以显示简单的理解问题的示例输入？ – Jarek

@Jarek：它是一个尺寸为（n，m）的二维数组。每个条目都是一个整数。通过“长度由输入确定”，我的意思是组件不知道内在大小，只有当它获得数据时才知道大小。 – EluciusFTW

所以你只有显示数据的问题，是吗？ – Jarek

回答

您可以用两个* ngFor-指令做到这一点：

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

Plunkr工作

来源

2017-03-06 13:38:25 Markai

我应该看看js中的数组。我不知道它们被解释为一个数组数组，即包含在单元数组中的一行数组。那很明显，谢谢。我更像是一个双索引数据结构。 – EluciusFTW

短例如：

我们的数组：

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

我们的模板：

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

来源

2017-03-06 13:43:06 Jarek

谢谢，看看我对@Markai的回答的评论。 – EluciusFTW

Angular2模板中的显示阵列

回答

相关问题