angularjs
  • sorting
  • 2015-04-01 40 views 0 likes 
    0

    我想为我的表格字段实施排序。我有一列显示时间。这里是我试过Angularjs按时间排序的时间为24小时

    <tr><td ng-click="predicate = 'appointmentTime'; reverse=!reverse">AdmitTime</td></tr> 
        <tr ng-cloak ng-repeat='listItem in apptList | filterencounters:searchModel | orderBy:predicate:reverse' ng-class='rowClass(listItem)'> 
        <td>{{listItem.appointmentTime}}</td> 
        </tr> 
    

    上面的代码工作的例子,但它是基于在AM PM &

    enter image description here

    我想24小时排序排序。

    +0

    分享您的过滤器的代码来检查 – mohamedrias 2015-04-01 06:22:43

    +0

    你不能排序日期这样的角度把他们当作普通的字符串而不是作为一个日期。你可以通过后台的24小时系统中的日期,并在前端格式化为所需的格式,并显示 – 2015-04-01 06:24:25

    +0

    @mohamedrias,我已经在我的问题中包含过滤代码 – NNR 2015-04-01 06:29:22

    回答

    0

    最佳做法是存储Date对象,对它们进行排序,然后使用筛选器将它们转换为您的格式:{{ listItem.appointedTime | date : 'HH:mm a' }}

    1

    这里是一个示例代码自定义过滤器:

    我用moment.js自定义排序在这里。

    angular.module("app", []) 
     
    .controller("Cont", function($scope){ 
     
        $scope.apptList = [{ 
     
    time : "01:00 PM" 
     
        }, 
     
        { 
     
    time : "02:05 PM" 
     
        }, 
     
        { 
     
    time : "10:42 AM" 
     
        }, 
     
        { 
     
    time : "10:44 AM" 
     
        }, 
     
        { 
     
    time : "10:45 AM" 
     
        }]; 
     
    }) 
     
    .filter('customOrderBy', function() { 
     
        return function (arr, parameter) { 
     
    return arr.sort(function(a, b) { 
     
        return moment(b.time, "hh:mm A").diff(moment(a.time, "hh:mm A")) > 0 ? -1 : 1; 
     
    }); 
     
    }; 
     
    });
    <html ng-app="app"> 
     
    <head> 
     
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script> 
     
        <script src="http://momentjs.com/downloads/moment.min.js"></script> 
     
        <meta charset="utf-8"> 
     
        <title>JS Bin</title> 
     
    </head> 
     
    <body ng-controller="Cont"> 
     
    <ul> 
     
        <li ng-repeat="app in apptList | customOrderBy">{{app.time}}</li> 
     
        </ul> 
     
    </body> 
     
    </html> 
     
    

    +0

    我必须在使用外部js(如moment.js)的角度执行此操作。无论如何感谢您的回复 – NNR 2015-04-01 07:04:11

    +0

    @NoOne太好了,希望您现在明白了。您可以更改排序功能并亲自进行比较以获得期望的结果 – mohamedrias 2015-04-01 07:20:37

    相关问题