angularjs日期時間排序在表格上無法正常工作

Question

我從後端獲取示例數據集（下面），我將它傳遞到angularjs表中。當我對日期列進行排序時，它將採用格式化（通過使用日期過濾器）日期字符串進行排序，而不是將真實長日期進行排序。

JSON數據

{ 
    "_id": ObjectId("57e21d452679a426808caa09"), 
    "name": "John", 
    "createdOn": NumberLong(1474436421360) 
} 

HTML

<table> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>Created Time</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="user in users"> 
      <td>{{ user.name }}</td> 
      <td>{{ user.createdOn | date : 'dd/MM/yy HH:mm' : timezone }}</td> 
     </tr> 
    </tbody> 
</table> 

Answer 1

您需要實現排序

檢查下面的例子。

angular 
 
    .module('demo', []) 
 
    .controller('DefaultController', DefaultController); 
 

 
function DefaultController() { 
 
    var vm = this; 
 
    vm.users = [ 
 
    { id: 1, name: 'John', date: 1474436481360 }, 
 
    { id: 2, name: 'Dale', date: 1444936421360 }, 
 
    { id: 3, name: 'Torres', date: 1464445481360 } 
 
    ]; 
 
}

table { 
 
    border-collapse: collapse; 
 
} 
 

 
th { 
 
    cursor: pointer; 
 
    background-color: #4CAF50; 
 
    color: white; 
 
} 
 

 
th:hover { 
 
    text-decoration: underline; 
 
} 
 

 
th, td { 
 
    padding: 15px; 
 
    text-align: left; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="demo"> 
 
    <div ng-controller="DefaultController as ctrl"> 
 
    <table border="1"> 
 
     <thead> 
 
     <tr> 
 
      <th ng-click="ctrl.sortBy = 'name'; ctrl.sortOrder = !ctrl.sortOrder">Name</th> 
 
      <th ng-click="ctrl.sortBy = 'date'; ctrl.sortOrder = !ctrl.sortOrder">Created On</th> 
 
     </tr> 
 
     </thead> 
 
     <tbody> 
 
     <tr ng-repeat="user in ctrl.users | orderBy: ctrl.sortBy : ctrl.sortOrder"> 
 
      <td ng-bind="user.name"></td> 
 
      <td ng-bind="user.date | date : 'dd/MM/yy HH:mm'"></td> 
 
     </tr> 
 
     </tbody> 
 
    </table> 
 
    </div> 
 
</div>