通过angularjs遍历多个字典中的键和值

问题描述：

我有一个json文件包含几个不同的字典。它看起来像这样：通过angularjs遍历多个字典中的键和值

{ 
    "variable_1": { 
    "1357840800": 74, 
    "1360519200": 71, 
    "1362938400": 83, 
    "1365616800": 74, 
    "1368208800": 78 
    }, 
    "name": "TITLE", 
    "variable_2": { 
    "1357840800": 25817, 
    "1360519200": 28585, 
    "1362938400": 26946, 
    "1365616800": 30034, 
    "1368208800": 23316 
    }, 
    "link": "title.html", 
    "variable_3": { 
    "1357840800": 1910483, 
    "1360519200": 2029593, 
    "1362938400": 2236587, 
    "1365616800": 2222556, 
    "1368208800": 1818661 
    } 
}

我要把数据从variable_1, variable_2 and variable_3在表中的不同列。任何变量具有相同数量的项目，并且它们的数量未知（可能是1,2,3,5,8 ...）。所有字典中的键都是相同的。所以新的<td>应该只包含来自另一个字典的值。

我写了代码来遍历一个字典，但我找不到多个字典的方法。

这是我的代码只有一个字典。我应该如何修改它来处理几个？

<table class="table ng-cloak" ng-if='isActive' ng-repeat="item in data | filter:isActive"> 
    <thead> 
    <tr> 
     <th>#</th> 
     <th>Date</th> 
     <th>Value</th> 
    </tr> 
</thead> 
<tbody> 
    <tr ng-repeat='(key, val) in item.variable_1'> 
    <td>{{ $index }}</td> 
    <td>{{ 1000*key + 1 | date:'MM.yyyy'}}</td> 
    <td>{{ val | splitdivisions }}</td> 
    </tr> 
</tbody> 
</table>

答

如果在每个目录键相互关联的，你可以简单地

<tr ng-repeat='(key, val) in item.variable_1'> 
<td>{{ $index }}</td> 
<td>{{ 1000*key + 1 | date:'MM.yyyy'}}</td> 
<td>{{ val | splitdivisions }}</td> 
<td>{{ item.variable_2[key] }}</td> 
<td>{{ item.variable_3[key] }}</td>

关闭'{{'和'}}'，在你的答案似乎是正确的...... – MarcoS

THX，代码自动完成在这个编辑器中不起作用:) –

答

你可能想分享您的过滤器（我在这里做删除）：

function MyCtrl($scope) { 
 
    $scope.data = { 
 
    "variable_1": { 
 
     "1357840800": 74, 
 
     "1360519200": 71, 
 
     "1362938400": 83, 
 
     "1365616800": 74, 
 
     "1368208800": 78 
 
    }, 
 
    //"name": "TITLE", 
 
    "variable_2": { 
 
     "1357840800": 25817, 
 
     "1360519200": 28585, 
 
     "1362938400": 26946, 
 
     "1365616800": 30034, 
 
     "1368208800": 23316 
 
    }, 
 
    //"link": "title.html", 
 
    "variable_3": { 
 
     "1357840800": 1910483, 
 
     "1360519200": 2029593, 
 
     "1362938400": 2236587, 
 
     "1365616800": 2222556, 
 
     "1368208800": 1818661 
 
    } 
 
    }; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app> 
 

 
<div ng-controller="MyCtrl"> 
 
    <table class="table" ng-repeat="(key, value) in data"> 
 
    <thead> 
 
     <tr> 
 
     <th>#</th> 
 
     <th>Date</th> 
 
     <th>Value</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr ng-repeat='(k, val) in value'> 
 
     <td>{{ $index }}</td> 
 
     <td>{{ 1000*k + 1 | date:'MM.yyyy'}}</td> 
 
     <td>{{ val }}</td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
</div> 
 
</div>

我周围玩一点与数据...，并添加自定义过滤器，见jsFiddle

通过angularjs遍历多个字典中的键和值

相关推荐