Estoy tratando de hacer un carrusel. Esta imagen de carrusel obtiene su cadena de ruta de imagen de una matriz de cadenas. cuando hago clic en la flecha izquierda o derecha, quiero que aumente o disminuya el índice, para poder cambiar la imagen que se muestra. ¿Cómo puedo hacer que esto suceda? NO se permite el código ts, solo se puede usar html.

 <div id="carouselExampleControls" class="carousel slide" data-bs-ride="carousel"> <div class="carousel-inner"> <ul *ngFor="let carImagePath of carImagePaths; let i= index;first as isFirst"> <div [ngClass]="isFirst ? 'carousel-item active' : 'carousel-item' "> <li><img [src]="imageUrl+carImagePath" class="d-block w-100" alt="..."></li> </div> </ul> </div> <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="visually-hidden">Previous</span> </button> <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="visually-hidden">Next</span> </button> </div> </div>