Angular - не удается выполнить операцию ng-repeat orderBy

Ответ 1

orderBy работает только с массивами - см. http://docs.angularjs.org/api/ng.filter:orderBy

Также отличный фильтр для использования вместо объектов Arrays @Angularjs OrderBy на ng-repeat не работает

Ответ 2

Как уже упоминалось, допускаются только массивы. Но чтобы сделать это простым для вас, вы можете динамически преобразовывать объект в массив через функцию трубопровода, как показано здесь https://gist.github.com/brev/3949705

Просто объявите фильтр и добавьте его в ng-repeat:)

<div ng-app="myApp">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<div ng-controller="Main">
  <div ng-repeat="release in releases | object2Array | orderBy:'environment_id'">{{release.environment_id}}</div>
</div>

<script>

var app = angular.module('myApp', []).filter('object2Array', function() {
    return function(input) {
      var out = []; 
      for(i in input){
        out.push(input[i]);
      }
      return out;
    }
  })
.controller('Main',function ($scope) {
        $scope.releases = {"tvl-c-wbap001 + tvl-webapp":{"timestamp":" 05:05:53 PM ","environment_id":"CERT5","release_header":"Projects/Dev","date":"19 Oct","release":"12.11.91-1"},"tvl-c-wbap401 + tvl-webapp":{"timestamp":" 10:07:25 AM ","environment_id":"CERT4","release_header":"Future Release","date":"15 Oct","release":"485-1"},"tvl-c-wbap301 + tvl-webapp":{"timestamp":" 07:59:48 AM ","environment_id":"CERT3","release_header":"Next Release","date":"15 Oct","release":"485-1"},"tvl-c-wbap201 + tvl-webapp":{"timestamp":" 03:34:07 AM ","environment_id":"CERT2","release_header":"Next Changes","date":"15 Oct","release":"13.12.3-1"},"tvl-c-wbap101 + tvl-webapp":{"timestamp":" 12:44:23 AM ","environment_id":"CERT1","release_header":"Production Mirror","date":"15 Oct","release":"13.11.309-1"},"tvl-s-wbap002 + tvl-webapp":{"timestamp":" 12:43:23 AM ","environment_id":"Stage2","date":"15 Oct","release":"13.11.310-1"},"tvl-s-wbap001 + tvl-webapp":{"timestamp":" 11:07:38 AM ","environment_id":"Stage1","release_header":"Production Mirror","date":"11 Oct","release":"13.11.310-1"},"tvl-p-wbap001 + tvl-webapp":{"timestamp":" 11:39:25 PM ","environment_id":"Production","release_header":"Pilots","date":"14 Oct","release":"13.11.310-1"},"tvl-p-wbap100 + tvl-webapp":{"timestamp":" 03:27:53 AM ","environment_id":"Production","release_header":"Non Pilots","date":"11 Oct","release":"13.11.309-1"}}
    });
</script>

Ответ 3

встроенный фильтр orderBy больше не будет работать при итерации объекта. Его игнорируют из-за того, как хранятся поля объектов. Вам нужно создать собственный фильтр

yourApp.filter('orderObjectBy', function() {
  return function(items, field, reverse) {
    var filtered = [];
    angular.forEach(items, function(item) {
      filtered.push(item);
    });
    filtered.sort(function (a, b) {
      return (a[field] > b[field] ? 1 : -1);
    });
    if(reverse) filtered.reverse();
    return filtered;
  };
});

<ul>
<li ng-repeat="item in items | orderObjectBy:'color':true">{{ item.color }}</li>
</ul>

Ответ 4

в ответе Eike Thies выше, если мы используем underscore.js, фильтр можно упростить до:

var app = angular.module('myApp', []).filter('object2Array', function() {
  return function(input) {
    return _.toArray(input);
  }
});

Ответ 5

Здесь приведен код @Julian Mosquera, который также поддерживает сортировку по клавише:

yourApp.filter('orderObjectBy', function () {
    return function (items, field, reverse) {
        // Build array
        var filtered = [];
        for (var key in items) {
            if (field === 'key')
                filtered.push(key);
            else
                filtered.push(items[key]);
        }
        // Sort array
        filtered.sort(function (a, b) {
            if (field === 'key')
                return (a > b ? 1 : -1);
            else
                return (a[field] > b[field] ? 1 : -1);
        });
        // Reverse array
        if (reverse)
            filtered.reverse();
        return filtered;
    };
});

Ответ 6

Вам придется переформатировать объект выпусков как массив объектов. Затем вы сможете отсортировать их так, как вы пытаетесь.

Ответ 7

Чтобы добавить к ответу Julian выше, orderObjectBy является автономным модулем angular: https://github.com/fmquaglia/ngOrderObjectBy

Ответ 8

orderby работает с массивами, которые содержат объекты с неопределенными значениями, которые могут использоваться в качестве фильтров, т.е.

controller.images = [{favs:1,name:"something"},{favs:0,name:"something else"}];

Когда повторяющийся массив повторяется, вы можете использовать | orderBy: 'favs', чтобы ссылаться на это значение, или использовать минус впереди, чтобы упорядочить нисходящий

<div class="timeline-image" ng-repeat="image in controller.images | orderBy:'-favs'">
    <img ng-src="{{ images.name }}"/>
</div>