Angular

ngFor and Change Detection

<button (click)="onAdd()">Add</button>
<ul>
	<li *ngFor="let course of courses;  index as i; even as isEven">
	{{course.name}} 
	<button (click)="onRemove(course)"Remove><button>
	</li>
</ul> 

onAdd(){
	this.courses.push({id: 4, name: 'course4'});
}
onRemove(course){
	let index = this.courses.indexOf(course);
	this.course.splice(index, 1);
}

• Angular runs change detection during
  • DOM events
  • Ajax requests
  • Timers