Multiple calendars on one page

[hakikihacioglu]

Hi,

is it possible to use more than 1 calendar on a page? If yes how can create 2 different variables

Thank you

[twinssbc]

@hakikihacioglu Binding the calendar to two different variables is easy. But just tried to put two calendar elements in one page, it seems the swiping function doesn't work properly. Swiping the second calendar causing the first one moves. Not sure if it's some ion-slides issue.

[hakikihacioglu]

How does assigning different variables to different calendars work?

[twinssbc]

    <calendar [eventSource]="eventSource"
              [calendarMode]="calendar.mode"
              [currentDate]="calendar.currentDate"
              (onCurrentDateChanged)="onCurrentDateChanged($event)"
              (onEventSelected)="onEventSelected($event)"
              (onTitleChanged)="onViewTitleChanged($event)"
              (onTimeSelected)="onTimeSelected($event)"
              [showEventDetail]="calendar.showEventDetail"
              step="30">
    </calendar>
    <calendar [eventSource]="eventSource2"
              [calendarMode]="calendar2.mode"
              [currentDate]="calendar2.currentDate"
              (onCurrentDateChanged)="onCurrentDateChanged($event)"
              (onEventSelected)="onEventSelected($event)"
              (onTitleChanged)="onViewTitleChanged($event)"
              (onTimeSelected)="onTimeSelected($event)"
              [showEventDetail]="calendar2.showEventDetail">
    </calendar>

[ngarland79]

Including ion-slides on the same page as the calendar actually locks the slides. Can't move them. Same thing with putting two calendars on the same page. Only the first one is swipeable.

[Titoch]

Hi,
When I use 2 calendars instances (MonthView) on 2 different pages/modules, the first one has a correct behavior.
But the swipes events performed on second calendar#2 are still handled by calendar#1 (even if not displayed / Not same page).

Is there a way to force subscribe/unsubscribe swipe's events on init/destroy of the page?
Thank you very much for your help!

[twinssbc]

@Titoch This is the known issue of ion-slides.
See ionic-team/ionic-framework#12008, Ionic team hasn't come up an official fix for it.

[pcsantana]

Hi @twinssbc ! Thanks for the great plugin!
The issue ionic-team/ionic-framework#12008 seems to be fixed, but I still have the same problem that @Titoch said. I have a second calendar in another page, but it not working as expected, just the first one works fine.
Any update on this issue?

Thank you again!

[pcsantana]

@twinssbc , sorry, it was my mistake!
Actually after searching a little I found your comment, and I realized that in my second page I used hidden, and this was causing the issue. I will change my logic to use *ngIf instead.

Thank you.