Skip to content
On this page

Comment utiliser windowToggle sur RxJS ?

Pour utiliser la fonction windowToggle de RxJS, vous devez d'abord inclure l'observable dans votre code en utilisant l'import suivant :

js
import { windowToggle } from 'rxjs';

Ensuite, vous pouvez utiliser la fonction windowToggle en la combinant avec un observable en utilisant l'opérateur pipe de la manière suivante :

js
sourceObservable.pipe(windowToggle(openings, closingSelector))

Dans cet exemple, sourceObservable est l'observable d'origine, openings est un observable qui déclenche la création d'une fenêtre, et closingSelector est une fonction qui prend l'observable de la fenêtre en cours comme argument et retourne un observable qui déclenche la fermeture de cette fenêtre.

Voici un exemple complet qui montre comment utiliser la fonction windowToggle pour diviser un flux d'événements en fenêtres en fonction d'un événement déclencheur :

js
import { fromEvent, interval, windowToggle } from 'rxjs';

const button = document.querySelector('button');
const sourceObservable = fromEvent(button, 'click');

const openings = sourceObservable.pipe(
  // Créer une fenêtre à chaque clic sur le bouton
  windowToggle(sourceObservable, () => interval(1000))
);

const subscription = openings.subscribe(win => {
  // Pour chaque fenêtre, imprimer les valeurs émises par l'observable de la fenêtre
  win.subscribe(
    value => console.log(`Next: ${value}`),
    err => console.log(`Error: ${err}`),
    () => console.log('Completed')
  );
});

Dans cet exemple, chaque clic sur le bouton déclenche la création d'une nouvelle fenêtre, et la fonction closingSelector utilise l'observable interval pour fermer la fenêtre au bout d'une seconde. Chaque fenêtre contient les valeurs émises par l'observable d'origine pendant qu'elle est ouverte.