Angular 2动态矩阵表格

13 浏览
0 Comments

Angular 2动态矩阵表格

如何在Angular 2中创建一个动态矩阵表？

矩阵应该如下所示：

    测试1   测试2   测试3
 A  1.5     1.8     1.6
 B  1.8     1.6     1.9
 C  1.6     1.6     1.8

这只是一个示例数据。JSON的大小是动态的。我可以有超过3个测试。我的JSON数据如下：

data = [{
 "test": "测试1",
  results: [{
    "env": "A",
    "result": 1.5
  }, {
    "env": "B",
    "result": 1.8
  }, {
    "env": "C",
    "result": 1.6
  }]
}, {
  "test": "测试2",
  results: [{
    "env": "A",
    "result": 1.5
  }, {
    "env": "B",
    "result": 1.7
  }, {
    "env": "C",
    "result": 1.6
  }]
}, {
  "test": "测试3",
  results: [{
    "env": "A",
    "result": 1.8
  }, {
    "env": "B",
    "result": 1.6
  }, {
    "env": "C",
    "result": 1.6
  }]
}];

提前致谢。

0

1 答案

0 Comments

Angular 2动态矩阵表格问题的原因可能是需要在页面中动态展示一个二维矩阵表格，但是在Angular中使用默认的*ngFor指令只能遍历一维数组，无法直接遍历二维数组。

解决这个问题的方法是使用两个嵌套的*ngFor指令来实现。首先使用外层的*ngFor遍历二维数组的每一行，然后在内层的*ngFor中遍历每一行的结果，并展示结果的值。

具体代码如下所示：


  
    {{column.result}}

另外，建议阅读该网站关于如何提问好问题的指南，这样你将能够获得更多的答案。

0