角度-无法使用... 重复工作订单

小开

最佳答案

orderBy仅适用于数组——参见 http://docs.angularjs.org/api/ng.filter:orderBy

也是一个很好的过滤器用于对象而不是数组@Angularjs OrderBy on ng-repeat doesn’t work Angularjs OrderBy on ng-重复不起作用

小开

您必须将您的发布对象重新格式化为对象的数组。然后你就可以按照你的方式来分类了。

小开

如前所述，只允许使用数组。但是为了简单起见，您可以通过管道函数动态地将对象转换为数组，如下所示 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>

小开

在 Eike Thies 上面的回复中，如果我们使用 underscore.js，filter 可以简化为:

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

小开

内置的 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>

小开

下面是@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;
};
});

小开

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>

小开

下面是@Julian Mosquera 的代码版本，它也支持一个“回退”字段，以便在主字段恰好为 null 或未定义时使用:

yourApp.filter('orderObjectBy', function() {
return function(items, field, fallback, reverse) {
var filtered = [];
angular.forEach(items, function(item) {
filtered.push(item);
});
filtered.sort(function (a, b) {
var af = a[field];
if(af === undefined || af === null) { af = a[fallback]; }


var bf = b[field];
if(bf === undefined || bf === null) { bf = b[fallback]; }


return (af > bf ? 1 : -1);
});
if(reverse) filtered.reverse();
return filtered;
};
});