title: Angular ngFor split by divs
body: <p>I have an array like this</p>
  
  <pre><code>[a, b, c, d, e, f, g, h, i]
  </code></pre>
  
  <p>My goal is to loop through it with <strong>ngFor</strong> split it by <strong>3</strong> elements, output should be like this</p>
  
  <pre><code>  &lt;div class="wrapper"&gt;
       &lt;div class="main"&gt;abc&lt;/div&gt;
       &lt;div class="main"&gt;def&lt;/div&gt;
       &lt;div class="main"&gt;ghi&lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>So solution I could make is</p>
  
  <pre><code>&lt;div class="wrapper"&gt;
        &lt;div *ngFor="let index = index; let letter of ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i']"&gt;
          &lt;div class="main" *ngIf="(index + 1) % 3 == 0"&gt;
              {{ letter }}
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>As you can see I made div over on div with class <strong>main</strong>. But I don't need any divs over <strong>main</strong> class div. I need exactly how it shows in example.</p>