Не могу нажать кнопку внутри основной карусели в адаптивном режиме

Question

Я использую PrimeNG v9 в angular проекте, когда я переключаю sh в адаптивный режим , я не могу нажать на кнопку внутри моей карусели, каждый раз, когда я нажимаю, я получаю следующий элемент в карусели. есть какое-то решение этой проблемы?

это мой HTML контент:

<p-carousel [value]="services" [numVisible]="3" [numScroll]="1" [circular]="true"
    [responsiveOptions]="responsiveOptions">
    <ng-template let-service pTemplate="item" >
            <div class="img-bg2">
                <img src="{{service.url}}" class="bg-img" />
                <div class=" zero" [ngStyle]="{'background-color':  service.bgColor }"></div>
            </div>
            <div class="content content2">
                <h4>{{service.title}}</h4>
                <p>
                    {{service.body}}
                </p>
                <a routerLink="{{service.goTo}}">
                    EN SAVOIR PLUS
                </a>
            </div>
    </ng-template>
</p-carousel>

вы можете проверить его на сайте primeNg:

1. Активировать отзывчивый mode
2. попробуйте нажать кнопку внутри

веб-сайт PrimeNg

Answer 1

я нашел решение:
я переопределяю changePageOnTouch в классе карусели

import {ElementRef, NgZone } from '@angular/core';
import { Carousel } from 'primeng/carousel';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent extends Carousel {

  constructor(public el:ElementRef,
    public zone: NgZone) {
    super(el,zone);
    Carousel.prototype.changePageOnTouch = (e,diff) => {}
}