javascript AngularJS orderBy 数组索引
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25115282/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AngularJS orderBy array index
提问by Coop
I have an ng-repeat that looks like this:
我有一个看起来像这样的 ng-repeat：
<div ng-app="questionnaire">
<div ng-controller="QuestionnaireCtrl">
<div ng-repeat="(key,val) in questions | orderBy:key">
{{questions[key].question}}
{{questions[key].answer}}
</div>
</div>
</div>
The controller looks like this:
控制器看起来像这样：
(function(){
var app = angular.module('questionnaire',[]);
app.controller('QuestionnaireCtrl', function($scope){
$scope.questions = {
someItem: { question : 'First question' },
anotherItem: { question : 'Next question here' },
upgradeItem: { question : 'Another one' }
};
});
})();
Now the ng-repeat works fine but displays the questions in a random order. I've tried using orderBybut can't get it working. I just want the questions and answers (which aren't currently in the array) to display in order of index (i.e. the order they're in the array). Alternatively I could add another field 'section' to the array and display them filtered in that order. E.g.
现在 ng-repeat 工作正常，但以随机顺序显示问题。我试过使用orderBy但无法让它工作。我只希望问题和答案（当前不在数组中）按索引顺序显示（即它们在数组中的顺序）。或者，我可以向数组中添加另一个字段“部分”，并按该顺序显示它们。例如
$scope.questions = {
someItem: { question : 'First question', section : '1' },
anotherItem: { question : 'Next question here', section : '1' },
upgradeItem: { question : 'Another one', section : '2' }
};
Fiddle example here: http://jsfiddle.net/k52ez/
这里的小提琴示例：http: //jsfiddle.net/k52ez/
采纳答案by dfsq
You cannot rely on object order, its not defined. In fact, orderByfilter is supposed to work with arrays only. If you need sorted output you should use array for questions:
你不能依赖对象顺序，它没有定义。事实上，orderBy过滤器应该只适用于数组。如果您需要排序输出，您应该将数组用于questions：
$scope.questions = [
{
question: 'First question',
section: 'someItem'
},
{
question: 'Next question here',
section: 'anotherItem'
},
{
question: 'Another one',
section: 'upgradeItem'
}
];
And ngRepeatbecomes:
并ngRepeat变成：
<div ng-repeat="question in questions">{{question.question}} {{question.answer}}</div>
Demo: http://jsfiddle.net/k52ez/2/
演示：http: //jsfiddle.net/k52ez/2/
回答by Raphael Müller
I made a custom filter for your problem.
我为您的问题制作了一个自定义过滤器。
Please see your updated jsfiddle
请查看您更新的jsfiddle
html:
html：
<div ng-repeat="question in questions | orderByKey">
javascript:
javascript:
app.filter('orderByKey', [function () {
return function (input) {
if (!angular.isUndefined(input)) {
var tmpInput = [];
angular.forEach(input, function(value, key){
tmpInput.push(key);
});
tmpInput.sort();
var tmpOutput = [];
angular.forEach(tmpInput, function(key){
tmpOutput.push(input[key]);
});
return tmpOutput;
} else {
return input;
}
};
There exists also another thread:
还有另一个线程：
https://stackoverflow.com/a/18186947/3641016
https://stackoverflow.com/a/18186947/3641016
but he uses named properties.
但他使用命名属性。
回答by Christoph Hegemann
The AngularJS Documentation on this matter is precise and fits your exact usecase. ReadTheDocs
关于这个问题的 AngularJS 文档是精确的并且适合您的确切用例。 阅读文档
Gathering your questions in an Object seems to be a strange thing to do. Objects have no order in their attributes so ngRepeat shouldn't know either. Instead you might want to put your questions into an ordered data structure like an array.
在 Object 中收集您的问题似乎是一件奇怪的事情。对象的属性没有顺序，所以 ngRepeat 也不应该知道。相反，您可能希望将您的问题放入像数组这样的有序数据结构中。
I updated your fiddle with an orderBy expression on a key Field in your Objects.
我用对象中关键字段上的 orderBy 表达式更新了你的小提琴。
JS:
JS：
$scope.questions = [
{question : 'First question' , key: 3},
{ question : 'Next question here', key: 2},
{ question : 'Another one', key: 1 }
];
HTML:
HTML：
<div ng-repeat="question in questions | orderBy:'key'">
