title: How to iterate two elements in a row with ngFor?
body: <p>I have array of strings and I want to place every two of them in a row with ngFor. Here is what I tried:</p>
  
  <pre><code>&lt;div class='row wow fadeInUp' *ngFor='let index of myArray;let i = index;'&gt;
       &lt;div class='col-md-6'&gt;
           &lt;md-card&gt;
              &lt;md-card-header&gt;
                 &lt;md-card-title&gt;
                   {{index}}
                 &lt;/md-card-title&gt;
               &lt;/md-card-header&gt;
            &lt;/md-card&gt;
       &lt;/div&gt;
       &lt;div class='col-md-6' *ngIf='i+1 &lt; myArray.length'&gt;
           &lt;md-card&gt;
              &lt;md-card-header&gt;
                 &lt;md-card-title&gt;
                   {{myArray[i+1}}
                 &lt;/md-card-title&gt;
               &lt;/md-card-header&gt;
            &lt;/md-card&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>But when I add a new element, it duplicates the previous element and I really don't underestand the reason. How can I add two elements in each row with ngFor?</p>