Угловые скользящие направляющие не защелкиваются

Я пытаюсь внедрить библиотеку Swiper Angular в свой проект Angular 10/Ionic 5. Проблема, с которой я сталкиваюсь, заключается в том, что слайды не фиксируются, и кажется, что это всего лишь одна большая страница, которую я могу перетащить.

Это пример «Начало работы», который я пробовал, он показывает страницы правильно, я полагаю, но часть смахивания кажется немного неправильной, без привязки, и она не продолжает скользить, если вы отпустите, как показано здесь.

<swiper class  = "slide-pic-preview" [slidesPerView] = "3" [spaceBetween] = "50"
        (swiper) = "onSwiper($event)" (slideChange) = "onSlideChange()"
        [navigation] = "true" [pagination] = "{ clickable: true }">

  <ng-template swiperSlide>Slide 1</ng-template>
  <ng-template swiperSlide>Slide 2</ng-template>
  <ng-template swiperSlide>Slide 3</ng-template>
  <ng-template swiperSlide>Slide 4</ng-template>
  <ng-template swiperSlide>Slide 5</ng-template>
  <ng-template swiperSlide>Slide 6</ng-template>
</swiper>

Я также установил все компоненты, необходимые для навигационной части в конструкторе:

constructor() {
SwiperCore.use([Navigation, Pagination, Scrollbar, A11y]); }

Кнопки навигации также не делают ничего, кроме запуска события onSlideChange, как и обычное пролистывание, но не с каждой страницей, а как каждые 20 пикселей, которые я перетаскиваю вокруг события.

И стиль импортируется в файл модуля scss.

Обновление: я только что узнал, что изменение размера окна браузера устраняет эту проблему, теперь мне просто нужно выяснить, как заставить его работать изначально.