How to Angular 6+ filter records between two dates?
Example 1:
The Angular Filters are used to display or modify
the live data as per your filter text. We can write the filter expression using
the pipe (|) character i.e.
{{
yourData| filterTypes }}
There are different types of filter which are
given below.
1. Uppercase
Filter
2. Lowercase
Filter
3. Currency
Filter
4. OrderBy
Filter
5. Filter
Example 1:
let
users: any[] = [{ "id": 1, "name":
"Anil Singh", "date":
"2019-06-01" },
{ "id":
2, "name": "Sunil",
"date": "2019-08-07"
},
{ "id":
3, "name": "Aradhya",
"date": "2019-11-22"
}];
//we need to parse
the strings to date object and use them in the comparison.
let
start_Date = new Date("01-02-2019");
let
end_Date = new Date("31-10-2019");
let
selectedUsers = this.users.filter(f => new
Date(f.date) > start_Date && new
Date(f.date) < end_Date);
console.log(selectedUsers); //filter result
Example
2:
//You just needs
to pass the models with the filter as parameters, like
app.filter('dateRange',
function () {
return function
(users, startDate, endDate) {
var
result = [];
var
from_date = Date.parse(startDate);
var
to_date = Date.parse(endDate);
//console.log(from_date,
to_date);
angular.forEach(users, function
(user) {
if
(user.date > from_date && user.date < to_date) {
result.push(user);
}
});
return
result;
};
});
And
the HTML code looks like –
<input ng-model="from_date" type="text" />
<input ng-model="to_date" type="text" />
<div ng-repeat="user in users | dateRange : from_date : to_date"></div>
|
Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..
|