时间戳

首页 > 解决方案 > Create dynamic html rows using angular 5

javascript - Create dynamic html rows using angular 5

问题描述

I'm very new to Angular, but I have a bit of java background. I'm trying to place every 4 divs in a new row, but all the divs are appending in the same row. The below one is my HTML code. How can I achieve the same through angular? The below code contains 1 row. I have to repeat the same for each row. 

<div class="row startRow">
    <div class="col-md-2 hidden-lg">&nbsp;</div>
    <div class="col-lg-3 col-md-2 shop-list" *ngFor="let shop of shops" (click)="onClick(shop.shopId)">
        <i class="material-icons UnSelectedImage">check_circle</i>
        <img src="{{shop.brandingImage}}"  alt="{{shop.name}}" class="img-responsive orgImage" />div 1                   
    </div>
    <div class="col-lg-3 col-md-2 shop-list"> div 2</div>
    <div class="col-lg-3 col-md-2 shop-list">div 3</div>
    <div class="col-lg-3 col-md-2 shop-list">div 4</div>
    <div class="col-md-2 hidden-lg">&nbsp;</div>
</div>

标签： javascriptangularangular-ui-router

解决方案

推荐阅读