Question

尝试通过选择用户来按升序或降序对数字数组进行排序。

这是我的代码 -

Order by: 
<select ng-model="orderCriteria">
    <option value="false">ASC</option>
    <option value="true">DESC</option>
</select>

<table border="2">
<th>Number</th>

    <tr ng-repeat="num in [1, 5, 3, 6, 45, 20, 7, 2] | filter: query | orderBy:num:orderCriteria">
        <td>{{num}}</td>
    </tr>
</table>

页面加载时，数字会按升序自动排序。当我打开下拉列表并选择DESC或ASC时，表将其顺序更改为降序（无论我选择什么）。

从那一刻起，我选择的内容并不重要，订单会按降序排列！

我做错了什么？

谢谢！

Answer 1

您的代码不起作用的原因是因为选择框中的true / false值是在过滤器表达式中始终产生“true”的字符串。

您可以尝试这样的事情：

<tr ng-repeat="num in [1, 5, 3, 6, 45, 20, 7, 2] | orderBy:num:(orderCriteria == 'true')">
     <td>{{num}}</td>
</tr>

Answer 2

为了能够轻松更改订单方向，您只需使用+/-修饰符：

<tr ng-repeat="num in numbers | orderBy: orderCriteria">
    <td>{{num}}</td>
</tr>

orderCriteria现在变为：

<select ng-model="orderCriteria">
    <option value="+">ASC</option>
    <option value="-">DESC</option>
</select>

关于谓词表达式的orderBy文档：

表达式可以选择带前缀+或 - 来控制升序或降序排序（例如，+ name或-name）。如果没有提供属性（例如'+'），那么数组元素本身用于比较排序的位置。

演示： http://plnkr.co/edit/IS4jDKTtlQd6Pg9VSxVU?p=preview

orderBy过滤器只能工作一次

2 个答案: