javascript 使用 $filter 根据 Angular 控制器中的属性对对象数组进行排序
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/32099716/
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
Sorting an array of objects based on a property in an Angular controller using $filter
提问by Rodrigo Galindez
I have an array of objects called $scope.segments
like this:
我有一个$scope.segments
像这样调用的对象数组:
[
{
"_id": "55d1167655745c8d3679cdb5",
"job_id": "55d0a6feab0332116d74b253",
"status": "available",
"sequence": 1,
"body_original": "Such a fork",
"__v": 0,
"body_translated": "Tal bifurcación"
},
{
"_id": "55d1167655745c8d3679cdb4",
"job_id": "55d0a6feab0332116d74b253",
"status": "available",
"sequence": 0,
"body_original": "So this is it.",
"__v": 0,
"body_translated": "Así que esto es."
}
]
I need to order this by array by sequence. So, I need the sequence 0 to appear first, the sequence 1 to appear next, and so on. In a view, I'm doing this and it works:
我需要按顺序按数组排序。所以,我需要先出现序列 0,接下来出现序列 1,依此类推。在一个视图中,我正在这样做并且它有效:
<ul ng-repeat="segment in segments | orderBy: 'sequence'">
<li>{{ segment.sequence }}</li>
</u>
However, I need the orderBy filter to work in a controller. I'm doing this:
但是,我需要 orderBy 过滤器才能在控制器中工作。我这样做:
$scope.test = $filter('orderBy')($scope.segments, 'sequence');
Where, $scope.test should be my ordered array of objects based on the the sequence property. However, when I do console.log('$scope.test') an empty array ([]
) shows. I imagine the $filter is not working in the controller.
其中, $scope.test 应该是我基于序列属性的有序对象数组。但是,当我执行 console.log('$scope.test') 时,会[]
显示一个空数组 ( )。我想 $filter 在控制器中不起作用。
Any ideas on how to solve this? Thanks!
关于如何解决这个问题的任何想法?谢谢!
回答by SuperVeetz
I guess you just didn't inject the $filter
service in your controller properly, because this worked for me.
我猜你只是没有$filter
正确地在你的控制器中注入服务,因为这对我有用。
<body ng-controller="MainCtrl">
<ul ng-repeat="segment in segments | orderBy: 'sequence'">
<li>{{segment.sequence}}</li>
</ul>
<script src="vendors/angular.min.js"></script>
<script>
angular.module('app', [])
.controller('MainCtrl', ['$scope', '$filter', function($scope, $filter) {
$scope.segments = [
{
"_id": "55d1167655745c8d3679cdb5",
"job_id": "55d0a6feab0332116d74b253",
"status": "available",
"sequence": 1,
"body_original": "Such a fork",
"__v": 0,
"body_translated": "Tal bifurcación"
},
{
"_id": "55d1167655745c8d3679cdb4",
"job_id": "55d0a6feab0332116d74b253",
"status": "available",
"sequence": 0,
"body_original": "So this is it.",
"__v": 0,
"body_translated": "Así que esto es."
}
];
$scope.test = $filter('orderBy')($scope.segments, 'sequence');
console.log($scope.test);
}]);
</script>
</body>
回答by tymeJV
You can always just sort the array (then you can even omit the orderBy
in the view - although you lose some of the magic with the bindings if anything is added):
你总是可以对数组进行排序(然后你甚至可以orderBy
在视图中省略- 尽管如果添加了任何东西,你会失去一些绑定的魔力):
$scope.segments.sort(function(a, b) {
return a.sequence - b.sequence;
});
回答by Rodrigo Galindez
As mentioned by tymeJV, the API call is async, and so the question is missing data to help answer it.
正如 tymeJV 所提到的,API 调用是异步的,所以问题是缺少数据来帮助回答它。