CODEWITHSUNDEEP
angularionic-frameworkcomponents
castamere
castamere

Reputation: 25

Ionic Angular Calendar Component

I'm using Ionic 5 & Angular 10 for my Project.

I'm looking for any component that can help me to make calendar like this.

Calendar

Thank you!!

Upvotes: 0

Views: 4590

Answers (3)

Jaime Lovera
Jaime Lovera

Reputation: 116

calendars and ionic doesn't like eachother that much, so i would suggest you creating a completly new one using a ionic page.

If you want to use ion2-calendar plugin, https://www.npmjs.com/package/ion2-calendar which I've used several times, there is a 'week-view' type of calendar.

I'd suggest you to follow this tutorial: https://devdactic.com/ionic-5-calendar-modal/ and when you get to the calendar- options definition, change 'month' to 'week':

calendar = {
   mode: 'week',
   currentDate: new Date(),
};

 selectedDate: Date;

@ViewChild(CalendarComponent) myCal: CalendarComponent;

constructor(
    private alertCtrl: AlertController,
    @Inject(LOCALE_ID) private locale: string,
    private modalCtrl: ModalController
  ) {}

EDIT: As I was searching for new plugins or components for a calendar I found this: https://openbase.com/categories/js/best-angular-calendar-libraries

There are several Calendar options to choose, but I've finally deleted ionic2-calendar and go ahead with angular-calendar.

Upvotes: 2

Spanchal
Spanchal

Reputation: 495

please use this one, I think this is the same as you want.

https://github.com/hsuanxyz/ion2-calendar

thanks.

Upvotes: 0

Callan
Callan

Reputation: 1233

I would recommend ion-datetime and try to customize it. I am not sure if you will be able to make it look exactly like in the picture, but I still think it is the best solution.

Upvotes: 1

Related Questions