title: Is there a difference between using slice in *ngFor directly or by pipe?
body: <p>I want to conditionally (<code>more=true/false</code>) show 3 elements of list or full list using slice pipe</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="table"&gt;
    &lt;div *ngFor="let item of list|slice:0:(more ? undefined : 3 )" class="row"&gt;
        {{ item.id }} {{ item.name }}
    &lt;div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><div class="snippet" data-lang="js" data-hide="true" data-console="true" data-babel="false">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!-- alternative form --&gt;
  
  &lt;div class="table"&gt;
    &lt;div *ngFor="let item of (more ? list : list|slice:0:3)" class="row"&gt;
        {{ item.id }} {{ item.name }}
    &lt;div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>but I can use <code>slice</code> directly (without pipe)</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="table"&gt;
    &lt;div *ngFor="let item of list.slice(0,more ? undefined : 3)" class="row"&gt;
        {{ item.id }} {{ item.name }}
    &lt;div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><div class="snippet" data-lang="js" data-hide="true" data-console="true" data-babel="false">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!-- alternative form --&gt;
  
  &lt;div class="table"&gt;
    &lt;div *ngFor="let item of (more ? list : list.slice(0,3) )" class="row"&gt;
        {{ item.id }} {{ item.name }}
    &lt;div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Both solutions works. Is there a performance difference between them?</p>
  
  <h2>UPDATE</h2>
  
  <p>More about this case <a href="https://stackoverflow.com/q/59329628/860099">here</a></p>