Grid System inside of a looping Angular 2+

SMoto R (SuperMotoRiders) commented 7 years ago

This is a small example and don't works, again list view is vertical: <div> <div><div class="block" *ngFor="let item of pizza"></div> <div><div *ngFor="let img of item.images"></div> <div><divclass="col-lg-4 col-md-6"></div> <div><ulclass="list"></div> <div><li></div> <div><imgstyle="max-width: 100%" [src]="img.imgP"alt=""></div> <div></li></div> <div><li>{{item.name}}</li></div> <div></ul></div> <div></div></div> <div><div></div> <div><div></div> </div> copy paste list of cards then make a loop inside angular and you will see dosen't work.....

---

SMoto R (SuperMotoRiders) commented 7 years ago

Here is my project, Thanks. https://we.tl/2u69ACzSZ4

---

<div class="row">

<div *ngFor="let item of pizza" class="col-lg-4 col-md-6 card">

<div class="card card-cascade wider" *ngFor="let img of item.images">

<div class="view overlay hm-white-slight">

<img [src]="img.imgP" class="img-fluid" alt="">

<a>

<div class="mask waves-effect waves-light "mdbRippleRadius></div>

</a>

</div>

<div class="card-body text-center no-padding">

<h4 class="card-title">

<strong>

<a href="">{{item.name}}</a>

</strong>

</h4>

<p class="card-text">{{item.description}}</p>

<div class="card-footer">

<span class="left">39$</span>

</div>

</div>

</div>

</div>

</div>

SMoto R (SuperMotoRiders) commented 7 years ago

Thanks a lot Damian. Works!!!

---