尽管对一组对象进行了ng-repeat,AngularJS命令仍然无法正常工作

时间:2016-03-07 07:39:50

标签: angularjs angularjs-orderby

我无法弄清楚为什么我的orderBy过滤器根本不起作用,我已经看过那里的每一个奇怪的解决方案,并且都指出{{{ 1}}操作对象的对象而不是对象数组。但是我的是一系列物体,如下所示:

ng-repeat

那么为什么这不起作用:

[Object, Object, Object]

0: Object
  $$hashKey: "object:19"
  dataLink: ""
  id: "633"
  name: "My first graph"
  order: 1
  parentTarget: ""
  presenceLink: ""
  size: 12
  span: 1
  subType: 1
  type: 1
  __proto__: Object
1: Object
  $$hashKey: "object:20"
  dataLink: ""
  id: "634"
  name: "My second graph"
  order: 2
  parentTarget: ""
  presenceLink: ""
  size: 6
  span: 1
  subType: 1
  type: 3
__proto__: Object
2: Object
  $$hashKey: "object:21"
  dataLink: ""
  id: "635"
  name: "My third graph but in front"
  order: 1
  parentTarget: ""
  presenceLink: ""
  size: 12
  span: 0
  subType: 1
  type: 1
__proto__: Object

有什么想法吗?

3 个答案:

答案 0 :(得分:3)

Angular的orderBy已经在指定键as you can see here的当前对象中查找,所以你必须像这样给出键:

<li class="col-xs-12 col-sm-6 col-md-{{graph.size}} p-x-md p-y-sm bg-light graphs-item" ng-repeat="graph in ds.graphs | orderBy:'order'">

答案 1 :(得分:1)

试试这个。

function Main($scope) {
    $scope.items = [
      {
        id: "633", name: "My first graph",order: 8, parentTarget: "",
         presenceLink: "",size: 12,span: 1,subType: 1,type: 1
       },
     {
       id: "634",name: "My second graph", order: 2,parentTarget:    "",
       presenceLink: "",size: 6,span: 1,subType: 1,type: 3
     }
    ];
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app>
    <div ng-controller="Main">
  <ul class="row graphs-list">
  <li  ng-repeat="item in items | orderBy:'order'">
    <pre>
      {{item.order}}
    </pre>
  </li>
</ul>
    </div>
</div>

答案 2 :(得分:1)

你可以试试这个:)

(function(angular) {
  'use strict';
angular.module('orderByExample', [])
  .controller('ExampleController', ['$scope', function($scope) {
    $scope.graphs =
        [{id:'633', name:"My first graph", order:1},
         {id:'634', name:"My Second graph", order:4},
         {id:'635', name:"My Third graph", order:5},
         {id:'636', name:"My Fourth graph", order:6},];
  }]);
})(window.angular);
HTML页面中的

<body ng-app="orderByExample">
  <div ng-controller="ExampleController">
  <table class="friend">
    <tr>
      <th>Name</th>
      <th>Phone Number</th>
      <th>Age</th>
    </tr>
    <tr ng-repeat="graph in graphs | orderBy: 'order'">
      <td>{{graph.id}}</td>
      <td>{{graph.name}}</td>
      <td>{{graph.order}}</td>
    </tr>
  </table>
</div>
</body>