title: ngFor items per row
body: <p>I am struggling with display my data with *ngFor loop.
  I want ngFor to display data 3 items per row. i tried with indexing. but then it was 1 item/row.</p>
  
  <pre><code>&lt;div class="container"&gt;
    &lt;div class="row"&gt;
      &lt;div class="mb-3 card-deck text-center"&gt;
        &lt;div class="card mb-4 box-shadow" *ngFor="let product of item.product;"&gt;
          &lt;div class="card-header"&gt;
              &lt;h4 class="my-0 font-weight-normal"&gt;{{ product.name }}&lt;/h4&gt;
          &lt;/div&gt;
          &lt;div class="card-body"&gt;
                  &lt;img src="{{ product.imagePath}}" class="img-thumbnail" alt="{{ product.name }}"&gt; 
                  &lt;p class="lead"&gt;{{ product.msg }} {{ product.msg2 }}&lt;/p&gt;
                  &lt;a role="button" class="btn btn-lg btn-block btn-primary" routerLink="product-details"&gt;More...&lt;/a&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I will highly appreciate any help. I am using</p>
  
  <pre><code>Angular-cli version 6.1.0
  bootstrap 4
  </code></pre>