使用 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'">
我想在 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'">