orderBy not working with groupBy

[arturokunder]

When you make a groupBy, filterBy is not working

For example:

[
  {
    category: 'alpha',
    id: 3,
    group: 'a'
  },{
    category: 'beta',
    id: 2,
    group: 'a'
  }, {
    category: 'gamma',
    id: 1,
    group: 'b'
  }
]

if you make

ng-repeat="(i, category) in array | orderBy: 'id' | groupBy: 'group' "
    {{ i }}
    ng-repeta="item in category" 
    {{ item.category }}

It's render:
a
alpha
beta
b
gamma

instead of
b
gamma
a
beta
alpha

[a8m]

@arturokunder Do you means orderBy ?

[arturokunder]

Yeah! i meant orderBy.
I fixed the typo

[a8m]

@arturokunder orderBy must be the last filter in the chaining (when you apply filter to the result of another filter).
But, groupBy return an object, and orderBy expect array as an arguments.
So, you can do something like that:

$scope.groups = [
    { category: 'alpha', id: 2 },
    { category: 'beta',  id: 3 }, 
    { category: 'gamma', id: 0 },
    { category: 'alpha', id: 4 },
    { category: 'beta',  id: 5 }, 
    { category: 'gamma', id: 1 }
   ];
  // retrieves the min 'id' of a collection, used for the group ordering.
  //you can use lodash instead. e.g: _.min(arr, 'id') 
  $scope.min = function(arr) {
    return $filter('min')
      ($filter('map')(arr, 'id'));
  }

 <ul ng-repeat="group in groups | groupBy:'category' | toArray:true | orderBy:min">
    <!-- print the group name -->
    <li>{{ group.$key }}</li>
    <!-- iterate over the group members and order each group by id -->
    <li ng-repeat="item in group | orderBy:'id'">
      {{ item }}
    </li>
</ul>

RESULT:

- gamma
  - {"category":"gamma","id":0}
  - {"category":"gamma","id":1}
- alpha
  - {"category":"alpha","id":2}
  - {"category":"alpha","id":4}
- beta
  - {"category":"beta","id":3}
  - {"category":"beta","id":5}

[a8m]

Here's a fiddle: link

[codeedog]

Also, Ariel's suggestion is more performant this way (assuming your list is unordered to start). order-by is an O(N*logN) operation. Group-by is O(N). By transposing the two (group-by, then order-by), the second and more expensive operation runs (on average) on a small subset of the items. That is, N items to be sorted in each order-by will be much smaller within each Group.

[arturokunder]

Worked great!
Thanks @a8m and @codeedog for the help!
I'm closing the issue.

[zarko-tg]

While trying this approach I experienced a certain performance issue as a side effect. The custom groupBy filter from http://sobrepere.com/blog/2014/10/14/creating-groupby-filter-angularjs/ worked better.

[a8m]

@zarko-tg , see v0.5.0 milestone, it's will be fix soon.

[zarko-tg]

@a8m cheers, glad it's on the way.

[Emerson-Coelho]

`

    <ul>
      <li ng-repeat="gp_up in necessidade.estacoes | groupBy:'GP_ID' | orderBy: 'GP_DESCRICAO'">
        GP: {{ gp_up[0].GP_ID }}  - {{ gp_up[0].GP_DESCRICAO }}
        <ul>
          <li ng-repeat="up_estacao in gp_up | groupBy: 'UP_ID' | orderBy: 'UP_DESCRICAO'">
            UP: {{ up_estacao[0].UP_ID }} - {{ up_estacao[0].UP_DESCRICAO }}
            <ul>
              <li ng-repeat="estacao in up_estacao | orderBy: 'ESTACAO_DESCRICAO'">
                ESTACAO: {{ estacao.ESTACAO }} - {{ estacao.ESTACAO_DESCRICAO }}
              </li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>

`
How to this case?
If you enter a new grouping, how do I re-order?