How to disable touch actions on carousel.

Expected behavior I have a only one manually controlled carousel and I want the user not to advance to the next slide by touch swapping. ¿how to prevent this? Only disable touch gestures on this carousel. In normal boostrap, i have "data-touch=false"

Actual behavior User can change the current slide of carousel making touch swap.

Resources (screenshots, code snippets etc.)

      <!--Carrousel-->
      <mdb-carousel
        #mySlider
        class=""
        [isControls]="false"
        [animation]="'slide'"
        [interval]="'0'"
        [noWrap]="true"
        [keyboard]="false">

        <!--Slide 0-->
        <mdb-carousel-item>
          <div class="carousel-slide">
            <div class="text-center">
              <p>Example 1</p>
            </div>
          </div>
        </mdb-carousel-item>
        <!--./Slide 0-->

         <!--Slide 1-->
        <mdb-carousel-item>
          <div class="carousel-slide">
            <div class="text-center">
              <p>Example 2</p>
            </div>
          </div>
        </mdb-carousel-item>
        <!--./Slide 1-->

        <!--Slide 2-->
        <mdb-carousel-item>
          <div class="carousel-slide">
            <div class="text-center">
              <p>Example 3</p>
            </div>
          </div>
        </mdb-carousel-item>
        <!--./Slide 2-->

      </mdb-carousel>
      <!--./Carrousel-->

I try prevent this behavior with @HostListener decorator, but not work.

  @HostListener('swipeleft', ['$event']) public swipeLeft(event: any) {
      console.log(event); // this works and show event data
    return false;
  }

Thanks!