Tengo un archivo de este tipo con marcado HTML
<div class="reviews__inner"> <swiper [pagination]="{ type: 'fraction'}" [navigation]="true" class="mySwiper"> <div class="slider__one"> <div class="wrapper__one"> <ng-template swiperSlide> <div *ngFor="let slide of slides" class="slide__one"> <div class="slide__wrap"> <img src="{{ slide.image }}" alt="stars" class="stars"> <div class="slide__title_size_s">{{ slide.title }}</div> <div class="slide__subtitle_size_s">{{ slide.subtitle }}</div> </div> </div> </ng-template> </div> </div> </swiper> </div>.TS
... SwiperCore.use([Navigation, Pagination]); ...Conecté el módulo swiper y no se muestra nada cuando se carga la página, y no hay errores en la consola. Hice todo de acuerdo a la documentación oficial.
Debe aplicar ngFor en ng-template con la directiva swiperSlide. Actualmente solo está creando una diapositiva. Además, no puede usar divs de envoltura como este en swiper. Siga el código a continuación
<div class="reviews__inner"> <swiper [pagination]="{ type: 'fraction'}" [navigation]="true" class="mySwiper"> <ng-template swiperSlide *ngFor="let slide of slides"> <div class="slide__one"> <div class="slide__wrap"> <img src="{{ slide.image }}" alt="stars" class="stars"> <div class="slide__title_size_s">{{ slide.title }}</div> <div class="slide__subtitle_size_s">{{ slide.subtitle }}</div> </div> </div> </ng-template> </swiper> </div>