按日期范围过滤ng-repeat（dd / MM / yyyy HH：mm格式）
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了按日期范围过滤ng-repeat（dd / MM / yyyy HH：mm格式）相关的知识，希望对你有一定的参考价值。
我试图通过其中一个变量是否属于所选日期来过滤ng-repeat中的列表。
我尝试过使用自定义过滤器来做到这一点，但到目前为止还没有任何结果。我试图装配的变量是dd-MM-yyyy HH：mm格式。
<div>
<input ng-model="dateFrom" />
<input ng-model="dateTo" />
<div ng-repeat="x in log2 | myfilter:dateFrom:dateTo" > {{x.Name}} In: {{x.In }} Out: {{x.Out}}</div>
</div>
MyApp.controller("MainController", function MainController($scope, $timeout, $firebaseArray, $filter, $window) {
$scope.log2 = [
{"Name": "John",
"In": "10-10-2017 11:42",
"Out": "10-10-2017 11:55",},
{"Name": "Rob",
"In": "10-01-2018 13:03",
"Out": "10-01-2018 14:30",}
]
$scope.dateFrom = "10-10-2000 ";
$scope.dateTo = "10-10-3000 ";
});
MyApp.filter("myfilter", function() {
return function(items, $scope) {
var df = $scope.dateFrom;
var dt = $scope.dateTo;
var result = [];
for (var i=0; i<items.length; i++){
var tf = new Date(items[i].In ),
tt = new Date(items[i].Out );
if (tf > df && tt < dt) {
result.push(items[i]);
}
}
return result;
};
});
尝试搜索一些东西，到目前为止还没有运气。考虑过使用ISO日期格式，但不确定如何将现有数据转换为角度的ISO格式。
在此先感谢您的任何帮助
答案
您可以使用angularjs过滤器和moment.js（库）轻松实现这一点
请看下面的示例代码：
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.21.0/moment.js"></script>
<script src="https://code.angularjs.org/1.6.6/angular.js"></script>
<script>
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.dateFrom = "2017-11-01";
$scope.dateTo = "2019-08-03";
$scope.log2 = [{
"Name": "John",
"In": "10-10-2017 11:42",
"Out": "10-10-2018 11:55",
}, {
"Name": "Rob",
"In": "10-01-2018 13:03",
"Out": "10-01-2018 14:30",
}]
});
app.filter("myfilter", function($filter) {
return function(items, from, to, dateField) {
startDate = moment(from);
endDate = moment(to);
return $filter('filter')(items, function(elem) {
var dateIn = moment(elem['In']);
var dateOut = moment(elem['Out']);
return (dateIn >= startDate && dateIn <= endDate) || (dateOut >= startDate && dateOut <= endDate);
});
};
});
</script>
</head>
<body>
<div ng-controller="MainCtrl">
<input type="text" name="S_Date" ng-model="dateFrom" />
<input type="text" name="E_Date" ng-model="dateTo" />
<div ng-repeat="x in log2 | myfilter:dateFrom:dateTo" > {{x.Name}} <b>In:</b> {{x.In }} <b>Out:</b> {{x.Out}}</div>
</div>
</body>
</html>以上是关于按日期范围过滤ng-repeat（dd / MM / yyyy HH：mm格式）的主要内容，如果未能解决你的问题，请参考以下文章
NSFetchedResultsController 对日期 (dd/mm/yyyy) 部分中的聊天项目进行排序，并且每个部分再次按 dd/mm/yy hh:mm:ss 排序