在表格角度中正确显示JSON [英] Properly display JSON in table angular
本文介绍了在表格角度中正确显示JSON的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个API，它返回一个JSON数组：
I have an API which return me a JSON array:
{"i":11,"j":12,"iterationNumber":9,"results":[12,6,3,10,5,16,8,4,2,1]}
如何以角度制作表格，以便正确显示数据？
目前我有这个：
How can I make a table in angular, so the data is displayed correctly? Currently I have this:
我的html代码是：
<table class="table table-striped " ng-show="tableR">
<thead>
<tr>
<th>i Value</th>
<th>j Value</th>
<th>iternation Number Value</th>
<th>results</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="x in data">
<td>{{x.i}}</td>
<td>{{x.j}}</td>
<td>{{x.iterationNumber}}</td>
<td>{{x.results}}</td>
</tr>
</tbody>
</table>
你能帮我修改最后一列，所以不要在一行中显示所有值，而是它将它显示在不同的行中？
Can you help me fix the last column, so instead of displaying all the values in one row, make it display it into different rows?
推荐答案
我相信这可能更接近天使席尔瓦所追求的目标。
I believe this might be closer to what Angel Silva is after.
HTML：
<body ng-controller="MainCtrl">
<table class="table table-striped">
<thead>
<tr>
<th>i Value</th>
<th>j Value</th>
<th>iternation Number Value</th>
<th>results</th>
</tr>
</thead>
<tbody ng-repeat="x in data">
<tr ng-repeat="r in x.results">
<td>{{x.i}}</td>
<td>{{x.j}}</td>
<td>{{x.iterationNumber}}</td>
<td>{{r}}</td>
</tr>
</tbody>
</table>
</body>
JavaScript / AngularJS：
JavaScript/AngularJS:
app.controller('MainCtrl', function($scope) {
$scope.data = [{"i":11,"j":12,"iterationNumber":9,"results":[12,6,3,10,5,16,8,4,2,1]}];
});
这是一个工作的Plunker的链接， http://plnkr.co/edit/NrnFI17P932KckzXRcF4?p=preview
Here's a link to a working Plunker, http://plnkr.co/edit/NrnFI17P932KckzXRcF4?p=preview
这篇关于在表格角度中正确显示JSON的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
