Ion-datetime badge

Hi community!

I’d like to implement a date-picker that highlights particular days, ideally with a number badge (let’s say on some days there are “x” events and I want to see it very quickly when choosing a date).

Today I’m using npm package “angular-calendar” which supports such badges out of the box, see for example Angular 12.0+ calendar

I’d like to use Ionic 6 ion-datetime instead, to have a simpler, more consistent setup and better mobile support (like slides).

My question is: would anybody know a simple solution to show some days in a different background color, and ideally even show a number badge on top of those dates?


From what I read and learned about the ion-datetime you can’t do this dinamically like that as it is just a datepicker not some sort of agenda or something like that. If the package you’re using is already covering what you need I think you should stick to it at least for now.

Yes that was my assumption as well. It’s a pity because this other npm package is not super mobile-friendly. But I’ll have to do with it.

My guess is because that kind of thing is extremely hard to implement and maintain. Sometimes is good to take a step back and evaluate the situation, maybe something else would also solve your problem? Best regards