AngularJS orderBy not working at all despite ng-repeat over an array of objects

Question

I can't figure out why my orderBy filter isn't working at all, I've looked at every freaking solution out there and all point to the fact that the ng-repeat is operating on an object of objects instead of array of objects. But mine is an array of objects as seen here:

[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

So how come this isn't working:

<ul class="row graphs-list">
  <li class="col-xs-12 col-sm-6 col-md-{{graph.size}} graphs-item" ng-repeat="graph in ds.graphs | orderBy:'graph.order'">
    <pre>
      {{graph.order}}
    </pre>
    <h5 class="graph-name" ng-bind="graph.name"></h5>
    <am-menu host="graph" options="graphs"></am-menu>
    <nvd3 options="gv.options[gv.getTypeFromId(graph.type)]" data="gv.data[gv.getTypeFromId(graph.type)]"></nvd3>
  </li>
</ul>

Any ideas?

Answer 1

Angular's orderBy already looks inside the current object for the specified key as you can see here, so you just have to give the key like so:

<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'">