Question

我在表头中排序日期字段时遇到了一些问题。排序ID适用于字符串和数字。我经历过http://jsfiddle.net/poppypoop/2463hsvd/。我替换了我的json并进行了测试。这也是基于字符串的工作。

Js代码：

Activity

Html代码：

<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>

这是基于String而不是日期的基础。谢谢你的帮助。

Answer 1

您的日期是按字符串建模的，因此应用的顺序就像日期是字符串一样。

如果您希望订购日期就像日期一样，那么您必须将字符串转换为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>

角度js中的日期表列排序问题

1 个答案: