Question

我想在角度视图中显示对象的属性数组。以下是对象

$scope._Json = {
    "foo": {
        "ItemDimension1": {
            "Item": "item1",
            "ItemIndex": 1,
            "SelectedItems": [{

                "Code": "Code1" 
            }]
        }
    },
    "bar": {
        "ItemDimension2": {
            "Item": "item2",
             "ItemIndex": 3,
            "SelectedItems": [{

                "Code": "code2" 
            }]
        },
        "ItemDimension3": {
            "Item": "item3",
            "ItemIndex": 2,
            "SelectedItems": [{

                "Code": "Code3" 
            }]
        }
    },
    "Lorem": {
        "ItemDimension4": {
           "Item": "item4",
            "ItemIndex": 5,
            "SelectedItems": [{

                "Code": "Code4" 
            }]
        }
    }
  };

我希望在视图中显示此内容，如

item1 - 1

item3 - 2

item2 - 3

item4 - 5

但它显示为

item4 - 5

item2 - 3

item3 - 2

item1 - 1

视图模板中的

<label ng-repeat="(catagory, items) in _Json">
          <li ng-repeat="(name, itemslist) in items | orderBy:'itemslist.ItemIndex'">

              <strong>{{itemslist.Item }}</strong> - <strong>{{itemslist.ItemIndex }}</strong> 

            </li>
       </label>

如何使用ItemIndex订购？

这是一个正确的方法吗？或者我想改变什么？

关于Angularjs OrderBy on ng-repeat doesn't work我已尝试过orderByobject但没有wrk

检查此Plunker来源

http://plnkr.co/edit/UCnrGJjLLaEjP7K5geV0?p=preview

Answer 1

您需要将ng-repeat的参数作为实际数组，以便内置命令才能工作。请参阅此问题：sorting values of a hash object in ngRepeat - angularJS

我会插入underscore.js（或lodash）并提前转换你的数据。

查看更新后的小提琴http://plnkr.co/edit/odMCOp65zbyfbEfmU3FX?p=preview

添加映射到你的控制器（注意，这是简单的顶级，参考更新的小提琴两级映射）

$scope._Json = _.map($scope._Json, function( v, k) { 
    return { key: k, value: v}      
})

并将标记更改为（再次，为简单起见，此处仅为顶级，引用更新的plnkr进行两级更新）：

<label ng-repeat="cat in _Json">
      <li ng-repeat="(name, itemslist) in cat.value | orderBy:'itemslist.ItemIndex'">        
          <strong>{{itemslist.Item }}</strong> - <strong>{{itemslist.ItemIndex }}</strong>               
      </li>
</label>

Answer 2

这应该可以解决问题：

<label ng-repeat="(catagory, items) in _Json">
   <li ng-repeat="(name, itemslist) in items | orderBy:'itemslist.ItemIndex':true">
      <strong>{{itemslist.Item }}</strong> - <strong>{{itemslist.ItemIndex }}</strong> 
   </li>
</label>

请参阅https://docs.angularjs.org/api/ng/filter/orderBy

如何使用嵌套对象将ng-repeat中的数据作为角度js中的JSON数据进行排序

2 个答案: