ChangeDetectionStrategy

Many js frameworks have way to watch changes on the javascript models and project them to the html.
In angular 1. this done by digest cycle.
In Angular2 this done by using zone.js
ChangeDetectionStrategy is how angular2 tracking run time changes of the model and projecting them to the DOM.
To be more precisely: framework will check components only when their inputs change or components' templates emit events.

example (or usecase)

Say we need to create upper menu component. In case that user not logged in it should display "login" link, and once somebody logged in - "logout" link should be displayed.

    <li><a [routerLink]="['/Login']" *ngIf="!(getLoggedIn() | async)">Login</a></li>
    <li><a href="#" (click)="logout()" *ngIf="getLoggedIn() | async">Logout</a></li>

So far things are pretty simple only inner model of component changes, and it is changes after request observable fires an event.

  changeDetection: ChangeDetectionStrategy.OnPush

That is good practice to tell angular not to track any other changes on the model since there could not be changes This way angular will work much quicker.

import { Component, ChangeDetectionStrategy } from '@angular/core';
import { ROUTER_DIRECTIVES, Router } from '@angular/router-deprecated';

import template from './menu.template.html';
import { UserService } from '../../../auth';

@Component({
  selector: 'top-menu',
  template: template,
  directives: [ROUTER_DIRECTIVES],
  changeDetection: ChangeDetectionStrategy.OnPush
})
...