嵌套在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'">