Category: rxjs

Categories
rxjs

RxJs: tap/do

Description: API / rxjs/operators
Transparently perform actions or side-effects, such as logging

import { of } from 'rxjs';
import { tap, map } from 'rxjs/operators';

const source = of(1, 2, 3, 4, 5);
//transparently log values from source with 'do'
const example = source.pipe(
    tap(val => console.log(`BEFORE MAP: ${val}`)),
    map(val => val + 10),
    tap(val => console.log(`AFTER MAP: ${val}`))
);
//'do' does not transform values
//output: 11...12...13...14...15
const subscribe = example.subscribe(val => console.log(val));
Categories
rxjs

RxJS – switchMap

Description: API / rxjs/operators
The main difference between switchMap and other flattening operators is the cancelling effect. On each emission, the previous inner observable (the result of the function you supplied) is canceled and the new observable is subscribed. You can remember this by the phrase switch to a new observable.

Example RxJS:-switchMap

gg

Categories
rxjs

RxJS

Introduction

RxJS is one of the latest libraries in web development. Offering a powerful, functional approach for dealing with events and with integration points into a growing number of frameworks, libraries, and utilities,

RxJS is a library for composing asynchronous and event-based programs by using observable sequences.

Observable Stream

  • – User Input
  • – Http Request
  • – Array
  • – Object

Observable Handle

  • – Data
  • – Error
  • – Completion

We can handle observable through of subscribe with three methods data,error and complete,

.subscribe(
(data) => console.log(data),
(error) => console.log(error),
() => console.log("Complete")
)

1- fromEvent

import {fromEvent} from 'rxjs'
fromEvent(this.addBtn.nativeElement,'click').subscribe((res)=> {console.log(res)})

2-Interval,timer

Example RxJS :- timer,interval,unsubscribe