angularjs
  • sorting
  • 2015-04-01 207 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

    相關問題