title: Angular 6 delay the loop
body: <p>I have a question about angular loops. I would like to delay the rendering process on a ng-for. For example,</p>
  
  <pre><code>&lt;div *ngFor="let data of items | delay"&gt;
    &lt;app-my-component [data]="data"&gt;&lt;/app-my-component&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Delay 10ms for each render. The "items" array comes from another component that I can't change it. Also, the "items" array size can be increased and decreased. Maybe, I can redirect it with observable struct. I have tried observable with async but I can't achieve. Can someone show me an example ?</p>