角顺序下拉选择列表答案

【问题标题】：Angular order dropdown select list角顺序下拉选择列表
【发布时间】：2014-01-06 13:07:24
【问题描述】：

如何使用 Angular 在选择下拉列表中对列表进行排序？

这是角度控制器：

var app = angular.module("app", []);

app.controller('Ctrl', function($scope, $filter, $http) {

    $scope.options= [
                  {
                    "id": 823,
                    "value": "81"
                  },
                  {
                    "id": 824,
                    "value": "77"
                  },
                  {
                    "id": 825,
                    "value": "152"
                  },         
                ];   

    });

还有html：

<h4>Angular-xeditable Editable row (Bootstrap 3)</h4>
<div ng-app="app" ng-controller="Ctrl">    
   <select ng-model="test" ng-options="v.id as v.value for v in options | orderBy: value"></select>
</div>

现在的顺序是：81、77、152

我想要：77,81,152

我该怎么做？

Jsfiddle 进行测试

谢谢

【问题讨论】：

标签： angularjs

【解决方案1】：

您的值是字符串，因此除非您将它们转换为整数，否则它们不会自然排序。您可以通过创建自己的过滤器或在 $scope 上定义简单的排序函数来转换它们：

Fiddle

<select 
  ng-model="test" 
  ng-options="v.id as v.value for v in options | orderBy: naturalOrder"
></select>

$scope.naturalOrder = function(item){
  return parseInt(item.value, 10);
};

【讨论】：

【解决方案2】：

您需要在 orderBy 中的字段名称周围放置单引号。 orderBy 的第一个参数是一个排序表达式字符串。

in options | orderBy:'value'

您可以通过在字段名称前添加+ 或- 来扩展它以指示初始排序方向。您还可以在排序表达式之后提供一个布尔值以启用排序方向的切换。

<div ng-init="desc=true">
...
in options | orderBy:'+value':desc

【讨论】：