How to carousal proper date wise select data set prev or next button?

{
"data": [
{
"press_id": "1",
"data11": [
{
"news_id": "9",
"image": "/26_327028192291471811.jpg",
"title": "Daman Boat Parking Area Development",
"description": "",
"layout": "0"
},
{
"news_id": "8",
"image": "/21_175883836182750584.jpg",
"title": "Visit to Riverfront Park at Duffnala",
"description": "",
"layout": "0"
},

],
"cover_image": "/23_29_8524647402534314.jpg",
"from_dt": "23-09-2024",
"to_dt": "29-09-2024"
},
{
"press_id": "2",
"data11": [
{
"news_id": "11",
"image": "/21_7878627309344664.jpg",
"title": "Gandhi Ashram - Site Assessment Visit",
"description": "",
"layout": "0"
},
{
"news_id": "12",
"image": "/27_0886059029498614.jpg",
"title": "The Beatles Ashram, Rishikesh",
"description": "",
"layout": "0"
},

],
"cover_image": "/22_9252375416640387.jpg",
"from_dt": "30-09-2024",
"to_dt": "06-10-2024"
},
{
"press_id": "3",
"data11": [
{
"news_id": "20",
"image": "/1.jpg",
"title": "Pawana and Indrayani River Rejuvenation, Pimpri Chinchwad",
"description": "",
"layout": "0"
},
{
"news_id": "27",
"image": "/8.jpg",
"title": "Apollo Flyover, Gandhinagar",
"description": "",
"layout": "0"
}
],
"cover_image": "/22_9719651855870003.jpg",
"from_dt": "07-10-2024",
"to_dt": "13-10-2024"
},
{
"press_id": "4",
"data11": [
{
"news_id": "32",
"image": "/32.jpg",
"title": "Jay Chemical Corporate House, Ahmedabad",
"description": "",
"layout": "0"
},

],
"cover_image": "/31.jpg",
"from_dt": "14-10-2024",
"to_dt": "20-10-2024"
},
{
"press_id": "5",
"data11": [
{
"news_id": "43",
"image": "/43_1947710417459452.jpg",
"title": "Beatles Ashram, Rishikesh",
"description": "",
"layout": "0"
},

],
"cover_image": "/41.jpg",
"from_dt": "21-10-2024",
"to_dt": "27-10-2024"
}
]
}
updateFilteredPressData() {
if (this.selectedDate) {
const selectedDate = new Date(this.selectedDate);
selectedDate.setHours(0, 0, 0, 0);
const selectedDateData: any[] = [];
const futureData: any[] = [];
const pastData: any[] = [];
this.pressLayouts.forEach((layout: any) => {
const fromDate = new Date(
layout.from_dt.split('-').reverse().join('-')
);
const toDate = new Date(layout.to_dt.split('-').reverse().join('-'));
fromDate.setHours(0, 0, 0, 0);
toDate.setHours(0, 0, 0, 0);
if (selectedDate >= fromDate && selectedDate <= toDate) {
selectedDateData.push(layout);
} else if (selectedDate < fromDate) {
futureData.push(layout);
} else {
pastData.push(layout);
}
});
futureData.sort((a: any, b: any) => {
const dateA = new Date(
a.from_dt.split('-').reverse().join('-')
).getTime();
const dateB = new Date(
b.from_dt.split('-').reverse().join('-')
).getTime();
return dateA - dateB;
});
pastData.sort((a: any, b: any) => {
const dateA = new Date(
a.from_dt.split('-').reverse().join('-')
).getTime();
const dateB = new Date(
b.from_dt.split('-').reverse().join('-')
).getTime();
return dateB - dateA;
});
this.filteredPressData = [
...selectedDateData,
...futureData,
...pastData,
];
this.activeIndex = 0;
console.log('Filtered Data:', this.filteredPressData);

this.currentPressData =
this.filteredPressData.length > 0
? this.filteredPressData[0].data11 || []
: [];
this.cdr.detectChanges();
} else {
this.filteredPressData = this.pressLayouts;
this.currentPressData =
this.filteredPressData.length > 0
? this.filteredPressData[0].data11 || []
: [];
}
}
updateCurrentPressData(index: any) {
if (this.filteredPressData[index.page]) {
this.selectedDate = null;
this.currentPressData = this.filteredPressData[index.page].data11 || [];
this.cdr.detectChanges();
} else {
this.currentPressData = [];
}

onDateChange(event: MatDatepickerInputEvent<Date>) {
if (event.value) {
this.selectedDate = event.value;
this.updateFilteredPressData();
this.cdr.detectChanges();
} else {
this.selectedDate = null;
this.filteredPressData = this.pressLayouts;
this.currentPressData =
this.filteredPressData.length > 0
? this.filteredPressData[0].data11 || []
: [];
}
}


when i first visit the press page and directly select a date the data is set fine but when i visit the pae and click the slider button and go to prev or next and then select a date the data is not set properly for example i select date from_date to to_dt between date 30-09-2024 then this date come first and data set to this date to next week date 07-10-2024 to 13-10-2024,14-10-2024 to 20-10-2024,21-10-2024 to 27-10-2024 and last data set to 23-09-2024 to 29-09-2024 this just for example for undestanding so, how can solutions carousal primeng in angualr date wise select data set `

Continue reading...