import {Component} from '@angular/core';
import {Observable} from 'rxjs/Observable';
<b>Angular Component Using Observables!</b>
<h6 style="margin-bottom: 0">VALUES:</h6>
<div *ngFor="let value of values">- {{ value }}</div>
<h6 style="margin-bottom: 0">ERRORs:</h6>
<div>Errors: {{anyErrors}}</div>
<h6 style="margin-bottom: 0">FINISHED:</h6>
<div>Finished: {{ finished }}</div>
<button style="margin-top: 2rem;" (click)="init()">Init</button>
private data: Observable<Array<number>>;
private values: Array<number> = [];
private anyErrors: boolean;
private finished: boolean;
this.data = new Observable(observer => {
let subscription = this.data.subscribe(
value => this.values.push(value),
error => this.anyErrors = true,
() => this.finished = true