Ionic 5 Ion-Slider Bound Options Not Affecting the Component

Question

I'm using Ionic 5 and wanted to customize the ion-slides bound options, but the object literal being bound to the component doesn't change anything in the UI.

I created an example Stackblitz so the options not working is replicated. You can see that even adding initialSlide doesn't seem to work, which is the example from their docs - Ionic Slides. I tried a bunch of Swiper parameters as well with no luck. In a separate Stackblitz using vanilla Swiper I can see what should be happening.

I'm sure it's probably something minor that I'm doing wrong. Can anyone see why the options aren't taking effect?

Answer 1

Instead of:

public slideOptions : {
  initialSlide: 2, 
  slidesPerView: 2,
  centeredSlides: true,
  spaceBetween: 30,
};

You want:

public slideOptions = {
  initialSlide: 2, 
  slidesPerView: 2,
  centeredSlides: true,
  spaceBetween: 30,
};

I tested transpiling both examples above at typescriptlang.org and the current code only transpiles into slideOptions; instead of the object you want.