当动态键值是数组时,如何使用ng-repeat

时间:2014-05-22 22:59:34

标签: javascript angularjs angularjs-ng-repeat ng-repeat

在我的控制器中,我有像......这样的数据。

    data = {
        chartTypes":["pie","donut","bar","line"],
        "features":{
            "stacked": ["true","true","true","false"],
            "percentage":["false","false","true","false"]
         }
    };

$scope.docStructure = data

有没有办法可以使用ng-repeat来迭代密钥,如果值是数组则再次迭代?

<div ng-app="chartFeatures" ng-controller="chartFeaturesCtrl" style="height:200px; background:red;">
        <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
            <th>&nbsp;</th>
            <th ng-repeat="chartType in docStructure.chartTypes">{{chartType}}</th>
        </tr>
        <tr ng-repeat="(feature,supportedList) in docStructure.features">
            <td>{{feature}}</td>
            <td ng-repeat="supported in supportedList">{{supported}}</td>
        </tr>

        </table>
    </div>

这些想法是我想要做一个交叉表,如下所示。

示例:

enter image description here

1 个答案:

答案 0 :(得分:2)

您只需要将track by $index添加到td标记上的ng-repeat

<td ng-repeat="supported in supportedList track by $index">{{supported}}</td>

这里是demo

您还可以转换您的&#34;功能&#34;数组包含对象而不是基元,然后你不需要track by $index

这里有demo