title: Why ExpressionChangedAfterItHasBeenCheckedError occur if change variable in ngAfterViewInit
body: <p>Consider this code in <a href="https://plnkr.co/edit/crs73tm21qBUkqpUlcXS?p=preview" rel="nofollow noreferrer">plunker example</a></p>
  
  <pre><code>@Component({
    //changeDetection: ChangeDetectionStrategy.OnPush,
    selector: 'my-app',
    template: `
      {{name}}
    `,
  })
  export class App {
    from: any;
    name: string;
    constructor() {
      this.name = '1'
    }
  
    ngAfterViewInit() {
      this.name = "2"
    }
  }
  </code></pre>
  
  <p>The above runs into <code>ExpressionChangedAfterItHasBeenCheckedError</code> error. </p>
  
  <p>I have a couple question</p>
  
  <ol>
  <li>Why is the error happening</li>
  <li>Does this mean that <code>ngAfterViewInit</code> is not within the digest cycle?</li>
  <li>Do we know what is the last hook that is within the digest cycle?</li>
  </ol>