Bootstrap 4 Карусель Индикатор не работает с Angular 7

Question

Вот мой код:

<div class="container">
  <div class="row">
    <div id="carouselExampleFade" class="carousel slide carousel-fade" data-ride="carousel" data-interval="3000">
        <ol class="carousel-indicators">
            <li data-target="#carouselExampleFade" *ngFor="let li of images; let i = index" [attr.data-slide-to]="i" [ngClass]="i == 0 ? 'active':''"></li>
        </ol>  
      <div class="carousel-inner">
        <div *ngFor="let image of images; let k = index" [ngClass]="k == 0 ? 'carousel-item active':'carousel-item'">
          <img class="d-block w-100" [src]=image.path [alt]=image.alt>
        </div>
      </div>
      <a class="carousel-control-prev" href="#carouselExampleFade" role="button" data-slide="prev">
          <span class="carousel-control-prev-icon" aria-hidden="true"></span>
          <span class="sr-only">Previous</span>
        </a>
        <a class="carousel-control-next" href="#carouselExampleFade" role="button" data-slide="next">
          <span class="carousel-control-next-icon" aria-hidden="true"></span>
          <span class="sr-only">Next</span>
        </a>
    </div>
  </div>
</div>

Код кажется правильным.Я пробовал несколько решений, но ни одно из них не работает.Любая помощь будет оценена

Answer 1

Ваш ngClass работает.Этот способ работает в AngularJ, но не в Angular 7. Вам нужно использовать этот способ: [ngClass] = "{'active': i == 0}".

Answer 2

Карусель отлично работает в угловых 7

рабочий пример: https://codesandbox.io/s/q9o6zyjr0w

если у вас есть какие-либо сомнения, вы можете прокомментировать ниже.