如何获取json嵌套对象的数据？
[英]How to get data of json nested objects?
问题描述
I am a newbie learning angularjs. 
我是学习angularjs的新手。 I am trying to access external api to get data from them. 我正在尝试访问外部api以从中获取数据。
The below image link is the json data that I get after http request from that api: 下面的图像链接是我从该api请求http之后获得的json数据：
In js file I have saved data as $scope.jsondata = data; 在js文件中，我已将数据另存为$scope.jsondata = data;
I want to create an table which will look like this: 我想创建一个如下表：
<div class="container" ng-controller="controller">
<table ng-repeat="data in jsondata">
<tr>
<th>Date</th>
<th>age</th>
<th>avg<th>
<th>num_payments</th>
</tr>
<tr>
<td> ?</td>
<td> ?</td>
<td> ?</td> // dont know what to give
</tr>
<table>
because when I tried to access the variable like jsondata.stats.histogram nothing comes up. 因为当我尝试访问jsondata.stats.histogram之类的变量jsondata.stats.histogram没有任何反应。 If I give jsondata.stats and print them I get following output 如果我给jsondata.stats并打印它们，我得到以下输出
1.[{"date":"201311","histogram":[{"ages":"<=18","num_payments":825,"avg":525.24},{"ages":"19-25","num_payments":49628,"avg":243.86},{"ages":"26-35","num_payments":181206,"avg":335.73},{"ages":"36-45","num_payments":208087,"avg":409.1},{"ages":"46-55","num_payments":209074,"avg":387.01},{"ages":"56-65","num_payments":156109,"avg":347.39},{"ages":">=66","num_payments":70881,"avg":400.2},{"ages":"Unknown","num_payments":4133,"avg":658.82}]},{"date":"201312","histogram":[{"ages":"<=18","num_payments":875,"avg":678.74},{"ages":"19-25","num_payments":56716,"avg":243.19},{"ages":"26-35","num_payments":200432,"avg":330.1},{"ages":"36-45","num_payments":227268,"avg":399.74},{"ages":"46-55","num_payments":227818,"avg":385.11},{"ages":"56-65","num_payments":166577,"avg":337.03},{"ages":">=66","num_payments":75534,"avg":373.36},{"ages":"Unknown","num_payments":4075,"avg":609.47}]},{"date":"201401","histogram":[{"ages":"<=18","num_payments":863,"avg":829.89},{"ages":"19-25","num_payments":64139,"av
1 个解决方案
解决方案1
0 已采纳 2014-11-11 04:13:30
First you have to understand your data structure. 首先，您必须了解您的数据结构。 It is array of object with date property. 它是具有date属性的对象数组。 For those every dates there are histogram array. 对于每个日期，都有直方图数组。 So there will be array of array that need to iterate. 因此，将有需要迭代的数组数组。
I assume you will create one table for every stats date and in every row of that table you want to list histogram data. 我假设您将为每个统计数据日期创建一个表格，并且要在表格的每一行中列出直方图数据。 So we need to iterate date in table level. 因此，我们需要在表级别迭代日期。 Later in row level we will iterate histogram array. 在行级别的后面，我们将迭代直方图数组。 The structure of the html will be like this below. html的结构如下所示。 You can see it live in this link . 您可以在此链接中看到它。 The example show the data initiated in local. 该示例显示了在本地启动的数据。 But it will work same with data fetched from server. 但是它将与从服务器获取的数据相同。 Furthermore read this documentation to get understand more with angular data iteration. 此外，请阅读本文档以进一步了解角度数据迭代。
<div class="container" ng-controller="MyCtrl">
<table ng-repeat="data in jsondata" border='1'> <!-- table level iteration -->
<tr>
<th>Date</th>
<th>age</th>
<th>avg</th>
<th>num_payments</th>
</tr>
<tr ng-repeat='histo in data.histogram'> <!-- row level iteration -->
<td>{{data.date}}</td>
<td>{{histo.ages}}</td>
<td>{{histo.avg}}</td>
<td>?</td>
</tr>
</table>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.