AngularJs ng-repeat order不适用于嵌套对象属性

我正在尝试ng-repeat嵌套对象的属性并对其进行排序,但是排序对我来说不起作用。

我已经看到了:如何使用嵌套属性在AngularJS中排序

但json结构不同,我无法正常工作。

柱塞

我的代码:

   <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
                            }
               }
            };

谁能告诉我我在做什么错?

非常感谢

阿维

JLRishe

这里有两个原因orderBy不起作用:

  • orderBy 仅适用于数组,但是您将其应用于普通对象。
  • 要按表达式排序,您需要orderBy在表达式中提供一个字符串值。您正在给它order.allListPosition,它等于$scope.order.allListPosition(不存在)。

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

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

要解决第二个问题(并结合dataArray上面的内容):

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

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

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在Angularjs中嵌套ng-repeat

来自分类Dev

ng-repeat范围不适用于其中的指令

来自分类Dev

AngularJS过滤不带ng-repeat的对象的单个属性

来自分类Dev

AngularJS嵌套ng-repeat范围

来自分类Dev

angularjs-ng-repeat仅适用于$ index

来自分类Dev

AngularJS ng-repeat过滤器特定的嵌套属性

来自分类Dev

AngularJS:ng-repeat用于纯文本

来自分类Dev

AngularJS。嵌套ng-repeat

来自分类Dev

AngularJS:指令模板中的数据绑定不适用于ng-repeat

来自分类Dev

当AngularJS对象属性为空时过滤ng-repeat

来自分类Dev

AngularJS嵌套ng-repeat onclick

来自分类Dev

ng-repeat不适用于表<tr>,但适用于列表<li>

来自分类Dev

JSON解析不适用于ng-repeat

来自分类Dev

嵌套的ng-repeat angularjs

来自分类Dev

AngularJS过滤不带ng-repeat的对象的单个属性

来自分类Dev

AngularJS,嵌套JSON和ng-repeat

来自分类Dev

AngularJS:ng-repeat用于纯文本

来自分类Dev

AngularJS-在ng -repeat中获取对象

来自分类Dev

Angular指令不适用于ng-repeat

来自分类Dev

AngularJS单控制器,用于ng-repeat-start和ng-repeat-end

来自分类Dev

ng-repeat不适用于json值

来自分类Dev

数据绑定不适用于嵌套ng-repeat

来自分类Dev

ng-repeat发现集中的AngularJS forEach设置对象属性

来自分类Dev

angularJS ng-repeat过滤器不适用于动态字段

来自分类Dev

溢出-不适用于ng-repeat

来自分类Dev

AngularJS-ng-repeat不适用于单个数组吗?

来自分类Dev

ng-repeat 不适用于对象的对象

来自分类Dev

带有 ng-repeat 的角度选择不适用于 json 对象

来自分类Dev

AngularJS ngAnimate 适用于 ng-leave 但不适用于 ng-enter