Question

我正在尝试迭代JSON响应并按对象中的另一个键值对排序（订单对象值，但看起来现在正在为我工作。

我可以用我迄今想不到的另一种方式重新格式化对象吗？

我在Angular有什么可以做的吗？

HTML

<div ng-app="myApp" ng-controller="Ctrl">
    <div ng-repeat="item in myCards">
        <h1>Title: {{item.title}}</h1>

        <div ng-repeat="(blockName, majorBlock) in item.blocks | orderBy:'order'">
            <h2>Name: {{blockName}}, Order: {{majorBlock.order}}</h2>
        </div>

    </div>
</div>

JS

angular.module('myApp', [])
    .controller('Ctrl', function($scope) {
        $scope.myCards =  {
            template: {
                tagline: 'Tagline',
                url: 'url',
                title: 'My Title',
                blocks: {
                    'cover': {
                        "coverUrl": "http://www.url.com/cover/",
                        "coverImage": "http://www.url.com/cover/",
                        "order": '1'
                    },
                    'text': {
                        "headerText": "amet anim est eu enim in incididunt cillum reprehenderit proident",
                        "order": '2'
                    },
                    'products_block': {
                        'order': '3'

                    }

                }
            }
        };
    });

小提琴：http://jsfiddle.net/fvdb3d3p/

我尝试了一些使用orderByArray插件的黑客攻击，但是他们打破了循环的其余部分。

Answer 1

问题是$scope.myCards.template.blocks是一个对象，而不是Array，您可以使用ng-repeat迭代一个对象，但过滤器orderby仅适用于数组，如您可以在API文档中看到：https://docs.angularjs.org/api/ng/filter/orderBy

您可能需要为此编写自定义过滤器。

修改：

我在http://justinklemm.com/angularjs-filter-ordering-objects-ngrepeat/
中找到了名为“orderObjectBy”的自定义过滤器
yourApp.filter('orderObjectBy', function() { return function(items, field, reverse) { var filtered = []; angular.forEach(items, function(item) { filtered.push(item); }); filtered.sort(function (a, b) { return (a[field] > b[field] ? 1 : -1); }); if(reverse) filtered.reverse(); return filtered; }; });

修改

我调整了原始过滤器功能，以便您可以访问对象的key，调整后的版本如下所示：

.filter('orderObjectBy', function() { return function(items, field, reverse) { var filtered = []; angular.forEach(items, function(item, key) { item.originalKey = key; filtered.push(item); }); filtered.sort(function (a, b) { return (a[field] > b[field] ? 1 : -1); }); if(reverse) filtered.reverse(); return filtered; }; })

示例：http://jsfiddle.net/fvdb3d3p/2/

orderBy没有按预期工作

1 个答案: