Создавайте карточки динамически на основе полученных данных

Question

Я написал код, в котором я вызываю конечную точку API, чтобы получить в ответ массив объектов. Каждый объект внутри массива я хочу отобразить как карточку. Теперь я могу перебирать ngFor l oop, но карты не размещаются рядом друг с другом, а складываются друг под другом. Мой HTML код:

<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
  <ol class="carousel-indicators">
    <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
    <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
  </ol>
  <div class="carousel-inner"  *ngFor="let a of b">
    <div class="carousel-item active">
        <div class="columns">
            <ul class="prices">
                <li class="header">{{a.firstprice}}</li>
                <li class="grey">{{a.firstRowValue}}</li>
                <li>{{a..secondRowValue}}</li>
              </ul>
          </div>
</div>

Еще у меня есть карусель, поэтому карточки продолжают двигаться. Кроме того, я хочу показать индикаторы для карусели, где я могу показывать 3 карточки на страницу и в зависимости от того, сколько объектов в массиве ... Он автоматически создает страницы соответственно.