Question

我正在学习AngularJS并尝试编写升序排序过滤器：

这是我的html文件：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
  <script src="../Scripts/angular.min.js"></script>
  <script src="../Scripts/Controllers/app.js"></script> 
</head>
<body ng-app="myApp">
    <ul ng-init="names = ['Peter','Anton','John']">
       <li ng-repeat="name in names | sortAscending ">
           <span>{{name}}</span>
       </li>
   </ul>
</body>
</html>

这是我的过滤器：

app.filter("sortAscending", function () {
    return function (input) {
        var result = [];
        for (var i = 0; i < input.length; i++) {
            if (input[i] > input[i + 1]) {
                result.push(input[i]);
            }
        }

        return result;
    }
});

关于比较值，循环中出现了问题。

我做错了什么？

Answer 1

三件事：

您的过滤器没有返回任何内容（缺少退货声明）
ng-init只应用于别名，在其中声明变量不是一个好习惯。在您的示例中，您应该使用ng-init将过滤器应用于您的数组，但是数组本身应该在控制器中声明。
您的排序算法不起作用。要对这样的简单数组进行排序，只需使用javascript sort（）方法即可。

这是一个工作的傻瓜，纠正了三点：

http://plnkr.co/edit/Qv9TDonFmpJsnIjx3dff?p=preview

 <ul  ng-init="sorted_names = (names | sortAscending)">
       <li ng-repeat="name in sorted_names ">
           <span>{{name}}</span>
      </li>
 </ul>

编辑：我想你想把它理解为一种练习形式，所以我的解决方案只针对你试图解决问题的方式。像其他提到的那样，你可以使用orderby过滤器来使这更容易。

Answer 2

orderBy怎么样：

<ul ng-init="names = [{name:'Peter'}, {name:'Anton'}, {name: 'John'}]">
    <li ng-repeat="name in names | orderBy:'+name' ">
        <span>{{name}}</span>
    </li>
</ul>

使用+符号加上前缀表示升序，或者 - 表示降序。

参考：orderBy

编辑：正如另一个答案所示，请不要使用ng-init来声明变量/对象。正如你在AngularJS文档中看到的那样，可以使用一个简单的控制器，不仅用于大多数目的，更重要的是用于练习目的。

AngularJS：如何编写升序排序过滤器

2 个答案: