Блог

Я хочу создавать карточки во время выполнения цикла, но отображение карточек по вертикали выравнивает каждую другую, которую я дал col-md-4, но это не сработало enter code here

 <div class="row-fluid border mt-3">
<div *ngFor="let data of allWidgets">

    <div class="col-md-4 border mt-3">
        <div class="card">
            <div class="img1">
                <img src="https://images.havenly.com/unsafe/550x334/filters:quality(50)/https://s3.amazonaws.com/static.havenly.com/assets/2a35d539-e889-405e-b495-815aa33f65ea" alt="">
            </div>
            <div class="img2">
                <img src="https://images.havenly.com/unsafe/180x180/filters:quality(50)/https://s3.amazonaws.com/havenlydesignerphotos/13078-profile-eb69eheadshot02.jpg" alt="">
            </div>
            <div class="mian-text mt-0">
                <p>{{data.name}}</p>
                <p><small>{{data.description}} </small> </p>
             <a href="" class="mr-5">View Profile</a> <span style="color: lightgray;">|</span> <a href="" class="ml-5">Select Cherise</a>

                
            </div>
           
        </div>
    </div>

</div>
 

вы должны использовать ngFor не для первого div, а для второго, как это :

 <div class="col-md-4 border mt-3" *ngFor="let data of allWidgets">
 

это решение вашей проблемы.
если вы хотите создать хорошую угловую карту, вы должны увидеть: https://mdbootstrap.com/docs/angular/

это наиболее часто используемый сайт в angular. хорошего дня 🙂