One very useful piece of behavior in components is the ability to track changes to the collections of children in the view. In many ways, this is quite a nebulous subject, as the number of ways in which view collections can be altered is numerous and subtle. Thankfully, Angular 2 provides a solid foundation for tracking these changes.
Note
The code, links, and a live example of this are available at http://ngcookbook.herokuapp.com/4112/.
Suppose you begin with the following skeleton application:
[app/inner.component.ts] import {Component, Input} from '@angular/core'; @Component({ selector: 'inner', template: `<p>{{val}}` }) export class InnerComponent { @Input() val:number; } [app/outer.component.ts] import {Component} from '@angular/core'; @Component({ selector: 'outer', template: ` ...