You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
If you have two calendars in your app, in the same mode, then instantiating the second raises an error "this.slider.on is not a function" in the ngAfterViewInit function of the relevant component e.g. here if the mode is week.
The reason seems to be that the new Swiper(...) call a couple of lines earlier creates an array of objects rather than a single one - maybe because the CSS selector has multiple matches.
You can see a simple example in this StackBlitz project, which is the standard ionic-calendar demo project, upgraded to v2.2.0, with the calendar HTML element duplicated.
Run it and check the console, where you can see the error.
While the error does not cause any obvious problems in the StackBlitz project, in my code the two calendars are on different pages, and moving from the page with the first calendar to the page with the second calendar does not work: the app stays on the first page, but shows the second page's navigation bar at the foot of the first page. So this is preventing me upgrading.
Some observations:
This behaviour was not there in ionic6-calendar, but Ionic, Angular, Swiper, and the calendar have all changed major version since then.
If the two calendars are in different modes e.g. week and month, then new Swiper(...) creates a single object, and the error does not occur.
The text was updated successfully, but these errors were encountered:
Some experimentation with Swiper shows that it does indeed create a Swiper instance for each matching CSS selector. So, for example, the weekview.ts ngAfterViewInit calendar code can accidentally create multiple instances when it matches on .weekview-swiper if there is more than one weekly calendar in the app. Perhaps the calendar needs to pass the component's HTML element to new Swiper(...) rather than a CSS selector.
If you have two calendars in your app, in the same mode, then instantiating the second raises an error "this.slider.on is not a function" in the
ngAfterViewInit
function of the relevant component e.g. here if the mode isweek
.The reason seems to be that the
new Swiper(...)
call a couple of lines earlier creates an array of objects rather than a single one - maybe because the CSS selector has multiple matches.You can see a simple example in this StackBlitz project, which is the standard ionic-calendar demo project, upgraded to v2.2.0, with the calendar HTML element duplicated.
Run it and check the console, where you can see the error.
While the error does not cause any obvious problems in the StackBlitz project, in my code the two calendars are on different pages, and moving from the page with the first calendar to the page with the second calendar does not work: the app stays on the first page, but shows the second page's navigation bar at the foot of the first page. So this is preventing me upgrading.
Some observations:
week
andmonth
, thennew Swiper(...)
creates a single object, and the error does not occur.The text was updated successfully, but these errors were encountered: