{
"id":1,
"name":"Jack",
"date":"01-06-2017"
},
{
"id":2,
"name":"Allen",
"date":"07-08-2017"
},
{
"id":3,
"name":"Annie",
"date":"22-11-2017"
},
This JSON stored in 'members' Array I want filter the member based on start and end date like:
let startDate;
let endDate;
let selectedMembers = this.members.filter(m => m.date > startDate && m.date < endDate);
something like that..
{
"id":1,
"name":"Jack",
"date":"01-06-2017"
},
{
"id":2,
"name":"Allen",
"date":"07-08-2017"
},
{
"id":3,
"name":"Annie",
"date":"22-11-2017"
},
This JSON stored in 'members' Array I want filter the member based on start and end date like:
let startDate;
let endDate;
let selectedMembers = this.members.filter(m => m.date > startDate && m.date < endDate);
something like that..
Share Improve this question edited Apr 20, 2018 at 8:22 Melchia 24.3k23 gold badges108 silver badges129 bronze badges asked Apr 20, 2018 at 7:56 M RameezM Rameez 1891 gold badge3 silver badges10 bronze badges 1-
Did you went through the basics of
ts
orjs
? – Shashank Vivek Commented Apr 20, 2018 at 7:57
5 Answers
Reset to default 4This is the solution of my problem:
members:any[] = [{
"id":1,
"name":"Jack",
"date":"01-06-2017"
},
{
"id":2,
"name":"Allen",
"date":"07-08-2017"
},
{
"id":3,
"name":"Annie",
"date":"22-11-2017"
}];
let start = "01-02-2017";
let end = "06-07-2017";
let.selectedMembers = this.members.filter(
m => new Date(m.date) >= new Date(startDate) && new Date(m.date) <= new Date(endDate)
);
console.log(selectedMembers);
u need first to transform the dates from string to Date type in order to pare them properly then do something like:
let members: any[] = [{
"id": 1,
"name": "Jack",
"date": "01-06-2017" // this should be of object Date()
},
{
"id": 2,
"name": "Allen",
"date": "07-08-2017" // this should be of object Date()
},
{
"id": 3,
"name": "Annie",
"date": "22-11-2017" // this should be of object Date()
}];
let start = "01-02-2017; // this should be of object Date()
let end = "06-07-2017"; // this should be of object Date()
let selectedMembers = members.filter(m => {
if ( m.date > start && m.date < end) // or you can cast here to Date()
return m;
});
console.log(selectedMembers);
To sort dates stored as strings, you should use an ISO based format: https://es.wikipedia/wiki/ISO_8601
The line you wrote will work with dates like that:
{ "id":1, "name":"Jack", "date":"2017-06-01" },
{ "id":2, "name":"Allen", "date":"2017-08-07" },
{ "id":3, "name":"Annie", "date":"2017-11-22" }
If not, you have to parse the strings to date object and use them in the parison. Something like this:
let startDate = new Date('2017-05-01');
let endDate = new Date('2017-09-01);
let selectedMembers = this.members.filter(m => new Date(m.date) > startDate && new Date(m.date) < endDate);
You need to reverse your date format, then convert it to TIMESTAMP for parison.
members = [{
"id":1,
"name":"Jack",
"date":"01-06-2017"
},
{
"id":2,
"name":"Allen",
"date":"07-08-2017"
},
{
"id":3,
"name":"Annie",
"date":"22-11-2017"
}];
const startDate ="25-06-2017";
const endDate = "10-11-2017";
// Here reverse the date format & then convert to TIMESTAMP
function reverseAndTimeStamp(dateString) {
const reverse = new Date(dateString.split("-").reverse().join("-"));
return reverse.getTime();
}
// A simple array filter like what you did
const selectedMembers = members.filter(m => {
return reverseAndTimeStamp(m.date) > reverseAndTimeStamp(startDate) && reverseAndTimeStamp(m.date) < reverseAndTimeStamp(endDate)
}
);
console.log(selectedMembers); // the result objects
Because you use french date format, you need own made transformer between string and Date object.
Then you have to deal with Date javascript object and timestamp representation.
Something like this will work.
function parseDate(input) {
var parts = input.match(/(\d+)/g);
// note parts[1]-1
return new Date(parts[2], parts[1]-1, parts[0]).getTime();
}
let startDate = parseDate('01-06-2017');
let endDate = parseDate('01-06-2018');
let selectedMembers = this.members.filter(m => {
const current = parseDate(m.date);
return current > startDate && current < endDate;
});