使用 orderBy 按日期排序数据仅按天数而不是年份对数据进行排序。 [AngularJS]

Sorting data by date using orderBy sorts data only by number of the day not by year. [AngularJS]

我想在 AngularJS 中使用 OrderBy 按日期对数据进行排序,并在此基础上显示最新数据。

问题是 orderBy 排序数据时只考虑了日期。我希望它考虑所有因素,例如月份和年份。

这是我正在处理的代码。

script.js

angular.module('Timeline', [])
.component("changeLog", {
  templateUrl: 'changeLog.html',
  controller: ('timelineController', timelineController)
});
function timelineController() {
  this.logs = [
    {
      "date": "01/7/2022",
      "title": "Change Log1",
      "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
      "link": "www.enquero.com"
    },
    {
      "date": "09/2/2018",
      "title": "User Analysis",
      "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
      "link": "www.google.com"
    },
    {
      "date": "11/2/2019",
      "title": "User Analysis",
      "desc": "This cool new feature has been added recently, maybe you should have a look.",
      "link": "www.google.com"
    },
  ];
}

changeLog.html

<div class="logArena" ng-repeat="log in $ctrl.logs | orderBy: '-date'">

  <ul class="timeline">
    <li>
      <span class="direction-l">
        <span class="time-wrapper">
          <span class="time">
              {{log.date}}
          </span>
        </span>
      </span>

      <div class="direction-r">
        <div class="flag-wrapper">
          <div class="flag">{{log.title}}</div>
        </div>
        <div class="desc">
          {{log.desc}}
        </div>
      </div>

    </li>
  </ul>

Index.html

<!DOCTYPE html>
<html ng-app="Timeline">
  <head>
    <title>Timeline App</title>
    <link rel="stylesheet" href="style.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body>
    <div>
      <center><h3>ChangeLog Wiki</h3></center>
      <change-log></change-log>
    </div>
  </body>
</html>

在 angular 一侧,您可以从您拥有的日期添加日期对象并使用该日期进行过滤 属性。

$scope.logs.forEach(function(log){
 log.dateObj = new Date(log.date);
})

将changeLog.html中的第一行改为 <div class="logArena" ng-repeat="log in $ctrl.logs | orderBy: '-dateObj'">