Content and view children

Earlier I said "change detection goes through every component in the component tree to check if the model it depends on changed" without saying much about how the framework does it. In what order does it do it? Understanding this is crucial, and that's what I'm going to cover in this section.

There are two types of children a component can have: content children and view children. To understand the difference between them, let's look at the following example:

@Component({
  selector: 'tab',
  template: `...`
})
class TabCmp {
}

@Component({
  selector: 'tabs',
  template: `
    Number of tabs: {{tabs.length}}
    <div>
      <ng-content></ng-content>
    </div>
    <div>
      <button (click)="selectPrev()">Prev</button>
      <button (click)="selectNext()">Next</button>
    </div&gt...