Configuring components to use explicit change detection with OnPush

The convention of Angular's data flow, in which data flows downward through the component tree and events float upwards, engenders some interesting possibilities. One of these involves controlling when Angular should perform change detection at a given node in the component tree.


The code, links, and a live example related to this recipe are available at

Getting ready

Begin with the following simple application:

[app/root.component.ts] import {Component} from '@angular/core'; import {Subject} from 'rxjs/Subject'; import {Observable} from 'rxjs/Observable'; @Component({ selector: 'root', template: ` <button (click)="$event)">Share!</button> ...

Get Angular 2 Cookbook now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.