角js中的日期表列排序問題

我在表頭中排序日期字段時遇到了一些問題。對於字符串和數字，排序ID正確工作。我已經通過http://jsfiddle.net/poppypoop/2463hsvd/。我替換了我的json並進行了測試。這也是基於字符串工作的。角js中的日期表列排序問題

JS代碼：

<script> 
    var myApp = angular.module("myApp",[]); 
    function myCtrl($scope){ 
     $scope.descending = false; 
     $scope.columnToOrderBy = 'date'; 
     $scope.data = [ 
      { 
      "defaultWH":"5", 
      "flowRouteName":"HIGH RISK", 
      "startDate":"01/03/2016", 
      "endDate":"23/03/2016", 
      "hiddenStartDate":1456837200000, 
      "commodityCode":"100042110", 
      "commodityId":8, 
      "stockingPointId":5 
     }, 
     { 
      "defaultWH":"8", 
      "flowRouteName":"HIGH RISK", 
      "startDate":"25/04/2016", 
      "endDate":"27/04/2016", 
      "hiddenStartDate":1459864800000, 
      "commodityCode":"100042110", 
      "commodityId":8, 
      "stockingPointId":8 
     }, 
     { 
      "defaultWH":"8", 
      "flowRouteName":"HIGH RISK", 
      "startDate":"04/03/2018", 
      "endDate":"20/03/2018", 
      "hiddenStartDate":1520101800000, 
      "commodityCode":"100042110", 
      "commodityId":8, 
      "stockingPointId":8 
     } 
     ]; 
    } 

</script>

HTML代碼：

<div ng-app="myApp"> 
    <div ng-controller="myCtrl"> 
     <table cellspacing="0" cellpadding="5" border="2"> 
      <tr> 
       <th ng-click=" columnToOrderBy ='startDate'; descending = !descending"> 
        Date 
       </th> 
       <th ng-click=" columnToOrderBy ='Location'; descending = !descending"> 
        Location 
       </th> 
      </tr> 
      <tr ng-repeat="item in data | orderBy:columnToOrderBy:descending"> 
       <td><div ng-bind="item.startDate">  </div></td> 
       <td><div ng-bind="item.flowRouteName">   </div></td> 
      </tr> 
     </table> 
    </div> 
</div>

這是工作在字符串的基礎不是日期的基礎。謝謝你的幫助。

來源

2016-03-02 user2877882

你的日期是用字符串建模的，所以按日期應用的順序就是字符串。

如果要將日期定爲日期，那麼必須將字符串轉換爲Date object。

不

"startDate": "01/03/2016",

但

// I let you deal with localizing your dates correctly 
// Here it represents the 3rd of January (m/d/y) 
// But I guess you want the 1st of March (d/m/y) 
// see this post for help http://stackoverflow.com/questions/5619202/converting-string-to-date-in-js 
"startDate": new Date("01/03/2016"),

var myApp = angular.module("myApp", []); 
 

 
function myCtrl($scope) { 
 
    $scope.descending = false; 
 
    $scope.columnToOrderBy = 'date'; 
 
    $scope.data = [{ 
 
    "defaultWH": "5", 
 
    "flowRouteName": "HIGH RISK", 
 
    "startDate": new Date("01/03/2016"), 
 
    "endDate": "23/03/2016", 
 
    "hiddenStartDate": 1456837200000, 
 
    "commodityCode": "100042110", 
 
    "commodityId": 8, 
 
    "stockingPointId": 5 
 
    }, { 
 
    "defaultWH": "8", 
 
    "flowRouteName": "HIGH RISK", 
 
    "startDate": new Date("05/04/2016"), 
 
    "endDate": "27/04/2016", 
 
    "hiddenStartDate": 1459864800000, 
 
    "commodityCode": "100042110", 
 
    "commodityId": 8, 
 
    "stockingPointId": 8 
 
    }, { 
 
    "defaultWH": "8", 
 
    "flowRouteName": "HIGH RISK", 
 
    "startDate": new Date("04/03/2018"), 
 
    "endDate": "20/03/2018", 
 
    "hiddenStartDate": 1520101800000, 
 
    "commodityCode": "100042110", 
 
    "commodityId": 8, 
 
    "stockingPointId": 8 
 
    }]; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp"> 
 
    <div ng-controller="myCtrl"> 
 
    <table cellspacing="0" cellpadding="5" border="2"> 
 
     <tr> 
 
     <th ng-click=" columnToOrderBy ='startDate'; descending = !descending"> 
 
      Date 
 
     </th> 
 
     <th ng-click=" columnToOrderBy ='Location'; descending = !descending"> 
 
      Location 
 
     </th> 
 
     </tr> 
 
     <tr ng-repeat="item in data | orderBy:columnToOrderBy:descending"> 
 
     <td> 
 
      <div ng-bind="item.startDate | date"></div> 
 
     </td> 
 
     <td> 
 
      <div ng-bind="item.flowRouteName"></div> 
 
     </td> 
 
     </tr> 
 
    </table> 
 
    </div> 
 
</div>

來源

2016-03-02 08:06:41

如何定義這種方法的日期格式（DD/MM/YYYY）？ –

這是另一個問題。嘗試自己搜索，看到這個帖子的幫助http://stackoverflow.com/questions/5619202/converting-string-to-date-in-js –

角js中的日期表列排序問題

回答

相關問題