Question

我有一个简单的json文件：

{"Item1": {"p1": {"p1sub1": 8, "p1sub2": 7}, "p2": {"p2sub1": 6, "p2sub2": 5} }, 
"Item2": {"p1": {"p1sub1": 4, "p1sub2": 3}, "p2": {"p2sub1": 2, "p2sub2": 1} } }

我这样检索：

app.controller('customersCtrl', function($scope, $http) {
        $http.get("content2.json")
        .success(function (data) {$scope.items = data;});
});

我在HTML中显示它：

<ul ng-repeat="(i, val) in items | orderBy:'p1.p1sub1'">
    <li>{{i}} - {{val.p1.p1sub1}} - {{val.p1.p1sub2}} - {{val.p2.p2sub1}} - {{val.p2.p2sub2}}</li>
</ul>

无论我在“orderBy”过滤器中添加了什么，我都明白了这一点：

Item1 - 8 - 7 - 6 - 5
Item2 - 4 - 3 - 2 - 1

有没有办法按'p1.p1sub1'值排序列表？

编辑：我想要的是用p1.subp1值以ascendent / descendent顺序排序的行（在本例中，p1.p1sub1对于item1为8，对于item2为4），例如：方兴未艾

Item2 - 4 - 3 - 2 - 1
Item1 - 8 - 7 - 6 - 5

递减

Item1 - 8 - 7 - 6 - 5
Item2 - 4 - 3 - 2 - 1

当然这只是一个小样本文件。最终文件将有许多要排序的项目。

Answer 1

正如@charlietfl在评论中所说，Javascript / JSON对象没有属性排序。幸运的是，JSON支持做具有固有排序的数组 - 甚至是索引！数组表示为用括号括起来的逗号分隔列表，例如["StringA", "StringB", "StringC"]将按顺序创建一个包含这些字符串的三项数组。

由于您说您可以更改JSON源，因此最简单的方法是将每个项目拆分为数组中自己的对象：

[
    { 
        "name": "Item1",
        "p1": {"p1sub1": 8, "p1sub2": 7},
        "p2": {"p2sub1": 6, "p2sub2": 5},
    }, {
        "name": "Item2",
        "p1": {"p1sub1": 4, "p1sub2": 3},
        "p2": {"p2sub1": 2, "p2sub2": 1},
    }
]

（如果您正在从字符串中解析JSON，请不要担心，Javascript＆＃39; JSON.parse()处理数组时无需执行任何特殊操作。）

然后您可以按原样使用数组的顺序，或使用与原始尝试类似的orderBy子句：

<ul ng-repeat="item in items | orderBy:'p1.p1sub1'">
    <li>{{item.name}} - {{item.p1.p1sub1}} - {{item.p1.p1sub2}} - {{item.p2.p2sub1}} - {{item.p2.p2sub2}}</li>
</ul>

但是如果您的实际项目使用索引-y名称方案，您甚至可以删除＆＃34; name＆＃34;来自JSON文件的属性，并使用Angular的特殊$index属性：

<ul ng-repeat="item in items | orderBy:'p1.p1sub1'">
    <li>{{'Item' + $index}} - {{item.p1.p1sub1}} - {{item.p1.p1sub2}} - {{item.p2.p2sub1}} - {{item.p2.p2sub2}}</li>
</ul>

Ascendent / descendent order可以通过在＆＃39; p1.p1sub1＆＃39;前加上前缀来控制。在orderBy中使用＆＃39; +＆＃39;或者＆＃39; - ＆＃39;，例如orderBy:'-p1.p1sub1'降序排列。

如何通过json属性

1 个答案: