How to use selectSlide in Angualr MDB Carousel

**Expected behavior**

Hi, Iam trying to provide a button outside the MDB carousel and on its press call the selectSlide method to move to a specific slide number. Iam doing this as follows:

on html

<button mdbBtn type="button" color="default" class="waves-light"mdbWavesEffect (click)="moveCarousel(index)"> Move to Slide </button>

<mdb-carousel #carousel id="carouselExampleFade" data-ride="carousel" class="carousel slide carousel-fade mt-3" [isControls]="true" [animation]="'fade'" [interval]="'0'">
      <ng-container *ngFor="let QnEl of questions">
            <mdb-carousel-item>
                .... do somethign with QnEl .... 
            </mdb-carousel-item>
      </ng-container>
</mdb-carousel>

On ts file

@ViewChild("carousel", { static: true }) 
public carousel: ElementRef; 

moveCarousel(index) 
{ console.log("moving carousel slide"); 
this.carousel.nativeElement.carousel.getSlide(index); 
}

**Actual behavior**>

The above code is not working and giving the following error: ERROR> TypeError: Cannot read property 'carousel' of undefined> at ExplorerComponent.moveCarousel (explorer.component.ts:57)

Basically, my question is - how do I capture the carousel on Angular so that I can use the selectSlide method? Please share an example.