Query con operatore OR in Firebase Cloud Firestore con RxJS

Query OR in Firebase Cloud Firestore con RxJS

Come implementare l'operatore logico OR in Firestore

Network

Approfondimenti

Cloud Firestore è una delle ultime caratteristiche di Firebase che vi permette di archiviare facilmente dati per le vostre applicazioni e di effettuare query per il loro recupero ma, quasi in maniera incredibile e come si può verificare dalla documentazione, è possibile effettuare query con l’operatore logico AND ma non con l’operatore logico OR.

Creare l’operatore OR in Firestore con RxJS

Grazie a RxJS possiamo ricreare l’operatore OR ed, in particolare, usando l’operatore RxJS combineLatest che permette combinare diversi stream di Observable in un unico stream che può essere quindi associato alla UI. L’operatore combineLatest invia valori a prescindere dal fatto che l’ Observable abbia o meno ricevuto nuovi dati e ciò è proprio quello di cui abbiamo bisogno. Pertanto, nell’esempio:

Creiamo gli Observable da Firestore

// Query per il Piemonte
var piemonteRef = citiesRef.where("regione", "==", "piemonte");

// Query per la Lombardia
var lombardiaRef = citiesRef.where("regione", "==", "lombardia");

// Observable.
var piemonte$ = new Rx.Subject();
var lombardia$ = new Rx.Subject();

// Inserisci i dati
piemonteRef.onSnapshot((querySnapshot) => {
var data = querySnapshot.docs.map(d => d.data());
piemonte$.next(data);
});

lombardiaRef.onSnapshot((querySnapshot) => {
var data = querySnapshot.docs.map(d => d.data());
lombardia$.next(data);
});

Combiniamo gli stream di Observable

// Combinazione OR
var piemonteOrlombardia$ = Rx.Observable.combineLatest(piemonte$,lombardia$).switchMap((cities) => {
// Destrutturiamo i valori
var [piemonteCities, lombardiaCities] = cities;
var combined = [
...piemonteCities,
...lombardiaCities
]

// Ritorniamo un nuovo Observable
return Rx.Observable.of(combined);
})

Registriamoci al nuovo stream

// Registriamoci
piemonteOrlombardia$.subscribe((result) => {
// Inviamo alla UI
var citiesEle = document.getElementById('cities');
result.forEach(city => {
var itemEle = document.createElement("li");
itemEle.textContent = city.name;
citiesEle.appendChild(itemEle);
});

Glue Labs, Firestore e Firebase

Esperti di soluzioni Cloud Based, ti supportiamo con assistenza e consulenza professionale, attraverso formazione avanzata e ti forniamo il servizio di Hosting Google Cloud per ospitare tutti i tuoi sistemi con 2 ore di consulenza gratuita al mese. Contattaci subito per un preventivo gratuito e senza impegno.

Cosa Facciamo

Casi di Successo

Uno dei leader mondiali di gestione di impianti industriali usa le nostre soluzioni System Integration e Web Application per dashboard, widget e automazione.

Inizia ora il tuo progetto