AngularJs ng-repeat orderBy不适用于嵌套对象属性 [英] AngularJs ng-repeat orderBy not working for nested object properties

问题描述

我试图重复嵌套对象属性并对它们进行排序，但订单对我来说不起作用。

I,m trying to ng-repeat nested object properties and order them, but the ordering isn't working for me.

我见过这样：
如何使用嵌套属性在AngularJS中排序

但json结构不同，我无法使其工作。

but the json structure is different and i couldn't get it to work.

Plunker

我的代码：

   <div ng-repeat="item in data | orderBy:order.allListPosition">
       <div>{{item.name}} - {{item.order}}</div>
   </div>

范围：

   $scope.data = {
           "78962": {
                 "id": "78962",
                 "name": "item 2",
                 "type": "blind",
                 "order": {
                       "allListPosition": "008",
                       "catListPosition": "059"
                       },
                 "data": {
                       "status": "stop",
                       "percent": 20
                       },
                 "longPress": {
                       "item": "78966",
                       "active": true
                      }
           },
            "78963": {
                   "id": "78963",
                   "name": "item 3",
                   "type": "coolmaster",
                   "order": {
                         "allListPosition": "053",
                         "catListPosition": "001"
                    },
                    "data": {
                           "status": 1,
                           "temp": 16,
                           "point": 25,
                           "mode": "cool",
                           "fan": 3
                          },
                 "longPress": {
                           "item": "78966",
                           "active": false
                            }
               }
            };

任何人都可以告诉我我的错误是什么吗？

Can anyone please show me what am i doing wrong?

感谢很多

Avi

推荐答案

两个原因 orderBy 在这里不起作用：

There are two reasons orderBy isn't working here:

• orderBy 仅适用于数组，但是您将它应用于普通对象。


• 要按表达式排序，您需要提供 orderBy 带表达式的字符串值。你给它 order.allListPosition ，它等于 $ scope.order.allListPosition （它不存在） ）。

• orderBy only works on arrays, but you are applying it to a plain object.
• To order by an expression, you need to give orderBy a string value with the expression. You are giving it order.allListPosition, which would equate to $scope.order.allListPosition (which doesn't exist).

要解决第一个问题，请添加数据对象数组：

To solve the first issue, add an array of your data objects:

$scope.dataArray = Object.keys($scope.data)
  .map(function(key) {
    return $scope.data[key];
  });

解决第二个问题（并合并 dataArray 从上面）：

To solve the second issue (and incorporate the dataArray from above):

<div ng-repeat="item in dataArray | orderBy:'order.allListPosition'">

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

这篇关于AngularJs ng-repeat orderBy不适用于嵌套对象属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！