嵌套在JSON中的数组的AngularJS排序

Question

目标：设置一个表，该表在从我们的服务器返回数据之后可以排序。

服务器返回的数据格式：

{
    "result" : {
        "code" : "OK",
        "msg" : ""
    },
    "data" : [{
            "row" : ["Fred", "64233", "197"]
        }, {
            "row" : ["Steve", "158879", "36"]
        }, {
            "row" : ["Ted", "115222", "12"]
        }
    ]
}

限制：无法更改服务器返回的数据格式。 我想要可排序的数据包含在“行”对象的数组中。 我尝试做类似的事情

<tr ng-repeat="roll in myWelcome.data" | orderBy:'roll.row[1]'">
   <td>{{ roll.row[0] }}</td><td>{{ roll.row[1] }}</td><td>{{ roll.row[2] }}</td>
</tr>

但这没用。 有任何想法吗？

Answer 1

我建议您在从服务器返回数据时对数据进行整理，以提高数据的可用性。 失败的话，您可以简单地实现一个自定义过滤器，该过滤器知道在哪里查找。

<tr ng-repeat="roll in myWelcome.data | customOrderBy:1">

过滤：

angular.module("Your_App").filter("customOrderBy", [function() {
    return function(data, index) {
         return data.sort(function(o) {
             return o.row[index];
         });
    };
}]);

Answer 2

我建议将您的数据转换为更标准的内容。 这将使您能够更好地维护和推理代码。

由于您无法更改服务器发送给您的数据格式，因此只需在数据到达客户端后就可以对其进行更改。

fetchData(results) {
   // Transform the results we get back from the server.
   this.myWelcomeData = results.data.map(function(input) {
      return {
         name: input.row[0],
         id: input.row[1],
         age: input.row[2]
      }
   });
}

然后，您可以使用常规的Angular转发器语法进行排序：

<tr ng-repeat="roll in myWelcomeData" | orderBy:'id'">