title: Change detection cycle in Angular - clarification?
body: <p>Regarding <code>ChangeDetectorRef</code>, I already know that -</p>
  
  <blockquote>
    <p><code>detectChanges</code>  actually triggers change detection while with -
    <code>markForCheck</code> - The actual change detection for the component is <strong>not</strong>
    scheduled but when it will happen in the future (either as part of the
    current or next CD cycle)</p>
  </blockquote>
  
  <p><a href="https://stackoverflow.com/a/45396740/859154"><em>Taken from here</em></a></p>
  
  <p>Looking at <code>markForCheck</code> - if it's not scheduled, so when will it run? Obviously after Observables callback, async callbacks and setTimout and events.</p>
  
  <p><a href="https://angular.io/api/core/ChangeDetectorRef" rel="nofollow noreferrer">The docs</a> has a component with <code>OnPush</code> strategy</p>
  
  <pre><code>@Component({
    selector: 'cmp',
    changeDetection: ChangeDetectionStrategy.OnPush,
    template: `Number of ticks: {{numberOfTicks}}`
  })
  class Cmp {
    numberOfTicks = 0;
  
    constructor(private ref: ChangeDetectorRef) {
      setInterval(() =&gt; {
        this.numberOfTicks++;
        // the following is required, otherwise the view will not be updated
        this.ref.markForCheck();
      }, 1000);
    }
  }
  </code></pre>
  
  <p><strong>Question:</strong></p>
  
  <p>If it marks for checking its ancestors, <em>for the next cycle</em>, so who ran the current cycle? (Is it the prev setTimeout invocation?)</p>
  
  <p>Because this code is showing each second being replaced by another - in other words each second there is a change detection (?!).</p>
  
  <p>What is actually going on here via a POV of steps?</p>