上一节:
下一节:

  AngularJS orderBy 过滤器

  • 定义和用法

    orderBy 过滤器允许我们对数组进行排序。
    默认情况下，字符串按字母顺序排序，数字按数字排序。

  • 语法

    {{ array | orderBy : expression : reverse }}

  • 参数

    参数 必需的 描述
    expression 否
    用于确定顺序的表达式。 表达式的类型可以是：
    String 字符串：如果数组是对象数组，则可以按对象属性之一的值对数组进行排序。 请参阅下面的示例。
    Function 功能：您可以创建一个功能来组织排序。
    Array 数组：如果需要多个对象属性来确定排序顺序，请使用数组。 数组项可以是字符串，也可以是函数。
    reverse 否 如果要反转数组的顺序，则设置为true。

  • 示例

    下例演示了 orderBy 过滤器对数组进行排序： 
    <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>欢迎来到蝴蝶教程</title>
<script src="//cdn.bootcss.com/angular.js/1.5.8/angular.min.js"></script>
</head>
<body>
    <p>与对象循环：</p>
    <div ng-app="myApp" ng-controller="namesCtrl">
         <ul>
               <li ng-repeat="x in names | orderBy:'country'">
                   {{ x.name + ', ' + x.country }}
               </li>
         </ul>
    </div>
    <script>
         angular.module('myApp', []).controller('namesCtrl', function($scope) {
            $scope.names = [
               {name:'Jani',country:'Norway'},
               {name:'Carl',country:'Sweden'},
               {name:'Margareth',country:'England'},
               {name:'Hege',country:'Norway'},
               {name:'Joe',country:'Denmark'},
               {name:'Gustav',country:'Sweden'},
               {name:'Birgit',country:'Denmark'},
               {name:'Mary',country:'England'},
               {name:'Kai',country:'Norway'}
            ];
         });
    </script>
</body>
</html>
    尝试一下

  • 相关页面

返回 AngularJS 参考手册
上一节:
下一节: