AngularJS не OrderBy работы с GroupBy

Question

У меня есть этот нг-ретранслятор, который выглядит следующим образом:

<ul> 
    <li ng-repeat="item in controller.collections.data | orderBy: '-plannedCollectionDate'"> 
     {{ item.plannedCollectionDate | date: 'fullDate' }} 
    </li> 
</ul> 

и это прекрасно работает, он получает свои данные и заказы в обратном направлении, но когда я пытаюсь это с GroupBy filter, orderBy игнорируется. Я попробовал, как это на первый:

<div ng-repeat="(key, value) in controller.collections.data | groupBy: 'plannedCollectionDate' | orderBy: '-plannedCollectionDate'"> 

    {{ key | date: 'fullDate' }} 

    <table class="table table-hover table-light"> 
     <tbody> 
      <tr ng-repeat="collection in value | filter: controller.filter" ng-click="controller.select(collection)" ng-class="{ active: controller.isSelected(collection), warning: collection.status.id === 2, success: collection.status.id === 4, danger: collection.status.id === 5 }"> 
       <td> 
        <div>{{ collection.supplierName }} {{ collection.description }}</div> 
        <div>to be collected by {{ collection.customerName }}</div> 
       </td> 
       <td> 
        <a ui-sref=".collect({ selected: [collection]})">{{ collection.status.name }}</a> 
       </td> 
       <td> 
        <button class="btn btn-danger" ng-click="controller.delete(collection.id)"> 
         <span class="fa fa-close"></span> 
        </button> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

Но это не сработало. После использования google я нашел решение, которое предложило следующее:

<div ng-repeat="group in controller.collections.data | groupBy: 'plannedCollectionDate' | toArray: true | orderBy: '-plannedCollectionDate'"> 

    {{ group.$key | date: 'fullDate' }} 

    <table class="table table-hover table-light"> 
     <tbody> 
      <tr ng-repeat="collection in group | filter: controller.filter" ng-click="controller.select(collection)" ng-class="{ active: controller.isSelected(collection), warning: collection.status.id === 2, success: collection.status.id === 4, danger: collection.status.id === 5 }"> 
       <td> 
        <div>{{ collection.supplierName }} {{ collection.description }}</div> 
        <div>to be collected by {{ collection.customerName }}</div> 
       </td> 
       <td> 
        <a ui-sref=".collect({ selected: [collection]})">{{ collection.status.name }}</a> 
       </td> 
       <td> 
        <button class="btn btn-danger" ng-click="controller.delete(collection.id)"> 
         <span class="fa fa-close"></span> 
        </button> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

Но это тоже не сработает. Может кто-нибудь помочь мне исправить это?

Answer 1

группа пользователей из angular-filter написали, что должно быть сделано here

пример: groupBy возвращает объект, но orderBy fiter ожидает array ..so использовать toArray:true и дать orderBy массив для работы с:

контроллер:

$scope.objectToArray= function(arr) { 
    return $filter('objectToArray') 
     ($filter('map')(arr, 'id')); 
     } 

Вид: Сейчас orderBy можно использовать $scope.objectToArray в вашем ng-repeat:

<div ng-repeat="group in controller.collections.data | groupBy: 'plannedCollectionDate' | toArray: true | orderBy: '-objectToArray'"> 

GL!