RxJS - Osservabili

Un'osservabile è una funzione che crea un osservatore e lo collega alla sorgente da cui sono attesi i valori, ad esempio clic, eventi del mouse da un elemento dom o una richiesta Http, ecc.

Observer is an object with callback functions, che verrà chiamato quando c'è interazione con l'Osservabile, cioè la sorgente ha interagito per un esempio di clic sul pulsante, richiesta Http, ecc.

Discuteremo i seguenti argomenti in questo capitolo:

• Crea osservabile
• Iscriviti Observable
• Esegui osservabile

Crea osservabile

L'osservabile può essere creato usando il costruttore osservabile e anche usando il metodo create osservabile e passando la funzione di sottoscrizione come argomento ad esso come mostrato di seguito -

testrx.js

import { Observable } from 'rxjs';

var observable = new Observable(
   function subscribe(subscriber) {
      subscriber.next("My First Observable")
   }
);

Abbiamo creato un osservabile e aggiunto un messaggio "Il mio primo osservabile" utilizzando subscriber.next metodo disponibile all'interno di Observable.

Possiamo anche creare Observable usando il metodo Observable.create () come mostrato di seguito -

testrx.js

import { Observable } from 'rxjs';
var observer = Observable.create(
   function subscribe(subscriber) {
      subscriber.next("My First Observable")
   }
);

Iscriviti Observable

Puoi iscriverti a un osservabile come segue:

testrx.js

import { Observable } from 'rxjs';

var observer = new Observable(
   function subscribe(subscriber) {
      subscriber.next("My First Observable")
   }
);
observer.subscribe(x => console.log(x));

Quando l'osservatore è iscritto, inizierà l'esecuzione dell'Osservabile.

Questo è ciò che vediamo nella console del browser:

Esegui osservabile

Un osservabile viene eseguito quando viene sottoscritto. Un osservatore è un oggetto con tre metodi che vengono notificati,

next() - Questo metodo invierà valori come un numero, una stringa, un oggetto ecc.

complete() - Questo metodo non invierà alcun valore e indica l'osservabile come completato.

error() - Questo metodo invierà l'errore, se presente.

Creiamo l'osservabile con tutte e tre le notifiche ed eseguiamo lo stesso.

testrx.js

import { Observable } from 'rxjs';
var observer = new Observable(
   function subscribe(subscriber) {
      try {
         subscriber.next("My First Observable");
         subscriber.next("Testing Observable");
         subscriber.complete();
      } catch(e){
         subscriber.error(e);
      }
   }
);
observer.subscribe(x => console.log(x), (e)=>console.log(e), 
   ()=>console.log("Observable is complete"));

Nel codice sopra, abbiamo aggiunto il metodo successivo, completo e di errore.

try{
   subscriber.next("My First Observable");
   subscriber.next("Testing Observable");
   subscriber.complete();
} catch(e){
   subscriber.error(e);
}

Per eseguire next, complete e error, dobbiamo chiamare il metodo di sottoscrizione come mostrato di seguito -

observer.subscribe(x => console.log(x), (e)=>console.log(e), 
   ()=>console.log("Observable is complete"));

Il metodo di errore verrà richiamato solo in caso di errore.

Questo è l'output visto nel browser -