title: how to avoid spaces in *ngFor loops in angular?
body: <p>Im creating a Star-Rating Component in Angular using <a href="https://fontawesome.com/" rel="nofollow noreferrer">fontawesome</a> <code>fa fa-star</code>  and <code>far fa-star</code>.</p>
  <p>This is the HTML Output, I want inside my component.</p>
  <pre><code>&lt;div style=&quot;font-size: 80%&quot;&gt;
      &lt;i class=&quot;fa fa-star&quot;&gt;&lt;/i&gt;
      &lt;i class=&quot;fa fa-star&quot;&gt;&lt;/i&gt;
      &lt;i class=&quot;fa fa-star&quot;&gt;&lt;/i&gt;
      &lt;i class=&quot;fa fa-star&quot;&gt;&lt;/i&gt;
      &lt;i class=&quot;far fa-star&quot;&gt;&lt;/i&gt;
  &lt;/div&gt;
  </code></pre>
  <p><a href="https://i.stack.imgur.com/iGwQ6.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/iGwQ6.png" alt="enter image description here" /></a></p>
  <p>If I do this with a Loop, I'm somehow getting spaces between the stars</p>
  <pre><code>&lt;div style=&quot;font-size: 80%&quot;&gt;
      &lt;ng-container *ngFor=&quot;let i of [1,2,3,4,5]&quot;&gt;
          &lt;i class=&quot;{{i &lt;= 4 ? 'fa' : 'far'}} fa-star&quot;&gt;&lt;/i&gt;
      &lt;/ng-container&gt;
  &lt;/div&gt;
  </code></pre>
  <p><a href="https://i.stack.imgur.com/cAP9U.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cAP9U.png" alt="enter image description here" /></a></p>
  <p>But it is fixed by making the loop a oneliner. So either deleting newlines in the code or switching the <code>*ngFor...</code> part to the <code>&lt;i&gt;</code> Tag and deleting the <code>&lt;ng-container&gt;</code> will fix the issue.</p>
  <pre><code>&lt;div style=&quot;font-size: 80%&quot;&gt;
      &lt;ng-container *ngFor=&quot;let i of [1,2,3,4,5]&quot;&gt;&lt;i class=&quot;{{i &lt;= 4 ? 'fa' : 'far'}} fa-star&quot;&gt;&lt;/i&gt;&lt;/ng-container&gt;
  &lt;/div&gt;
  
  &lt;!-- Both work --&gt;
  
  &lt;div style=&quot;font-size: 80%&quot;&gt;
      &lt;i *ngFor=&quot;let i of [1,2,3,4,5]&quot; class=&quot;{{i &lt;= 4 ? 'fa' : 'far'}} fa-star&quot;&gt;&lt;/i&gt;
  &lt;/div&gt;
  </code></pre>
  <hr />
  <blockquote>
  <p>So how do I achieve this without making sure that the <code>ngFor</code> loop is only on one line?</p>
  <p>How to prevent the space when the iteration body has a newline?</p>
  </blockquote>