Question

我正在尝试使用Angular中的ng repeat重复多维数组的子数组。我的json对象是：

 $scope.items =   [{    "id":1,
        "BasisA":"1",
        "Basis":true,
        "personSex":"m",
        "isCollapsed":false,
        "name":"Mark Polos",
        "age":"1955",
        "results":[{"1000":{"company_name":"***","model":"***","modelname":"***","pr":222,"rating":4.5,"priority":9,"matching":1},
                    "1001":{"company_name":"***","model":"***","modelname":"***","pr":228.7,"rating":5.7,"priority":7,"matching":2},
                    "1002":{"company_name":"***","model":"***","modelname":"***","pr":241.7,"rating":1.9,"priority":4,"matching":3}
                }]
    }]

尝试过这样的事情：

... data-ng-repeat="item in items">

然后在这个孩子的桌子上：

<tr data-ng-repeat="i in item | orderBy:'insItem.pr'">

Answer 1

看起来结果属性实际上不是“数组”。如果这只是你的例子中的一个错字，那么就不要理会。如果没有......请继续阅读。

它看起来像一个带有单个项目的数组，而该Item是一组属性，而这些属性又是对象。换句话说，您可以使用看起来像item.results[0]["1000"].pr的代码来引用名为“1000”的结果的属性“pr”，而不是代码看起来像ng-repeat所期望的那样（item.results[0].pr）

你可以在获得它们时转换你的项目，以便结果是一个真正的数组吗？

或者 - 您可以使用控制器内部的函数返回您要查找的数组吗？

查看代码：

<... data-ng-repeat="result in resultsFromItem(item)" >

控制器代码：

$scope.resultsFromItem = function (item) {

   if(item==undefined || item.results==undefined || item.results.length==0) {
      return [];
   }

   var myResults = [];
   for (var key in item.results[0]) {
      if(item.results[0].hasOwnProperty(key)) {
         myResults.push(item.results[0][key]);
      }
   }

   return myResults;

}

如果您愿意，您甚至可能决定将“已转换”的结果对象挂在每个项目对象上（因此您只需要进行一次转换）。

Answer 2

您应该访问结果字段：

... data-ng-repeat="item in items">

<tr data-ng-repeat="i in item.results">

由于嵌套数组位于主对象的results属性中。

Answer 3

我使用了三个嵌套的ng-repeat指令来实现这一目标:-)第三个ng-repeat使用ng-repeat="(key, value) in result"功能来显示所有结果对象键和值，我使用了帮助这个答案在how to iterate over keys and values in ng-repeat上。 orderBy:部分尚未运行（如果有人知道如何实施，那么欢迎任何帮助）。

    <ul>
      <li ng-repeat="item in items">
         id: {{item.id}}, name: {{item.name}}, age: {{item.age}}, results: 
         <table>
           <tr ng-repeat="result in item.results">
             <td>
               <table style="border: 1px solid black;">
                  <tr ng-repeat="(key, value) in result | orderBy: value.pr">
                    <td> {{key}} </td> <td> {{ value }} </td>
                  </tr>
              </table>
            </td>
          </table>
      </li>
    </ul>

Plunker

ng在数组中重复数组

3 个答案: