I am using Angular Calendar (see demos here https://mattlewis92.github.io/angular-calendar/#/kitchen-sink)
And I need to apply a different class to a day (or more) that I select. So, if I click on a day (or more), I need them to be pink or something.
I have done something similar with today cell
const today_cell: 'today-cell' = 'today-cell';
export class MonthCalendarComponent implements OnInit {
todayCssClass: string = today_cell;
beforeMonthViewRender({ body }: { body: CalendarMonthViewDay[] }): void {
body.forEach(day => {
if (day.isToday === true) {
day.cssClass = this.todayCssClass;
}
}
}
but I am not using click event. How can I do it?
There is a live demo in the Component you linked to, doing exactly what you need to do. Selecting multiple days and coloring them in pink, with full code and as mentioned a demo: https://mattlewis92.github.io/angular-calendar/#/selectable-period
There's a predefined css class .cal-day-selected
which is used to color the selected days and in the demo the selected days are inside an array selectedDays: any = [];