call_customObservable1.ts

customObservable({
  next: val => console.log(val),
  error: err => console.error(err),
  complete: () => console.log('Completed')
});

customObservable1.ts

function customObservable(observer: Observer<T>){
  observer.next(1);
  observer.next(2);
  observer.complete();
}

customObservable2.ts

function customObservable(observer: Observer<T>){
  observer.next(1);
  observer.next(2);
  observer.complete();
  observer.next(3);
}

customObservable3.ts

function customObservable(observer: Observer<T>){
  let counter = 1;
  const out = setInterval(() => observer.next(counter++), 1000);
  return () => {
    console.log('done');
    clearInterval(out);
  };
}
const streamObservale = customObservable({
  next: val => console.log(val),
  error: err => console.error(err),
  complete: () => console.log('Completed')
});
setTimeout(() => {
  streamObservale();
  }, 3100);

observer.ts

interface Observer<T> {
  closed?: boolean;
  next: (value: t) => void;
  error: (err: any) => void;
  complete: () => void;
}

out1.sh

1
2
Completed

out2.sh

1
2
Completed
3

out3.sh

1
2
3
done

rxjs-create.ts

import { Observable } from 'rxjs'; 

const source = Observable.create((observer) => {
  let id = 0; // setting up a counter
  setInterval(() => {
    observer.next(id++);
  }, 1000);

  return () => { id = 0; console.log('Counter cleared');}
})

const sub = source.subscribe(val => console.log(val));

// unsubscribe after 4.5 sec
setTimeout(() => {
  sub.unsubscribe();
}, 4500);

rxjs-from.ts

import { from } from 'rxjs';
import { take } from 'rxjs/operators';

const fromArray = from([1, 2, 3]); // observable of the values 1,2,3
fromArray.subscribe(value => console.log(value));

// infinite iterable of values
function* generateNumbers(seed) {
  let i = seed;
  while(true) {
    yield i;
    i *= 2;
  }
}
const iter = generateNumbers(100);
const fromGenerator = from(iter).pipe(take(5)); // 100, 200, 400, 800, 1600
fromGenerator.subscribe(value => console.log(value));

// from a promise
const promise =  new Promise((resolve, reject) => {
  resolve(true);
  reject(false);
});
const source = from(promise);
source.subscribe(x => console.log(x));

rxjs-fromEvent.ts

import { fromEvent } from 'rxjs';

const source = fromEvent(document, 'click'); // capture click events

// show mouse coordinates
source.subscribe(point => console.log(`(${point.clientX}, ${point.clientY})`));

rxjs-interval.ts

import { interval } from 'rxjs';

const source = interval(1000); // every 1 second

source.subscribe(x => console.log(x));

rxjs-of.ts

import { of } from 'rxjs';

const observableOf = of(1, 2, 3); // an observable of the values 1,2,3

observableOf.subscribe(value => console.log(value));

rxjs-range.ts

import { range } from 'rxjs';

const source = range(10, 5); // 10, 11, 12, 13, 14

source.subscribe(x => console.log(x));

rxjs-timer.ts

import { timer } from 'rxjs';

const source = timer(2000, 3000); // start after 2 second, then every 3 seconds

source.subscribe(x => console.log(x));