【问题标题】:AngularJS: Sorting issueAngularJS:排序问题
【发布时间】:2014-06-05 18:32:34
【问题描述】:

利用 AngularJS orderBy 过滤器我在这里创建了一个可排序的表,

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

我在点击时使用每个表头的“反向”值来确定排序的方向。这会产生一个明显的问题,但是当我单击不同的表头时,它们只是转到与之前可能已从另一个表头更改的反向值相反的值。

<th ng-click="predicate = 'character'; reverse=!reverse">alpha</th>
<th ng-click="predicate = 'num'; reverse=!reverse">num</th>
<th ng-click="predicate = 'dec'; reverse=!reverse">dec</th>
<th ng-click="predicate = 'value'; reverse=!reverse"></th>
<th ng-click="predicate = 'date'; reverse=!reverse">date</th>

ng-repeat 使用 orderBy 过滤器填充我的表格行

<tr ng-repeat="line in infoCtrl.data | orderBy:predicate:reverse">

如何隔离 reverse 的范围,或者给它们一个单独的 reverse 值?

【问题讨论】:

    标签: angularjs sorting angularjs-orderby


    【解决方案1】:

    理想情况下,我会在反转排序布尔值之前检查谓词的当前值。如果相同,请反转它。否则,将其重置为默认值。

    在你的控制器中有一个用于排序的函数:

     $scope.predicate = "character";
     $scope.reverse = false    
     $scope.sort = function(p) {
         if ($scope.predicate == p) {
             $scope.reverse = !$scope.reverse;
         } else {
             $scope.predicate = p;  
             $scope.reverse = false;
         }
     }
    

    并从 html 调用此函数:

        <th ng-click="sort('character')">alpha</th>
        <th ng-click="sort('num')">num</th>
        <th ng-click="sort('dec')">dec</th>
        <th ng-click="sort('value')"></th>
        <th ng-click="sort('date')">date</th>
    

    【讨论】:

    • 所以问题在于,除了“字符”列之外,没有其他列是可排序的。也许我误解了什么?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-09-22
    • 2016-12-09
    • 1970-01-01
    • 2015-11-22
    • 1970-01-01
    • 2013-10-22
    相关资源
    最近更新 更多