Implémenter l'interrogation avec angulaire et rxjs

Question

Je souhaite implémenter l'interrogation dans mon nativescript avec une application angulaire. Je veux vérifier par exemple chaque seconde l'état de mon serveur backend. J'ai ce service:

@Injectable() 
export class StateService { 
getStatus(): Observable<StateApp> { 
     let headers = this.getHeaders(); 
     return this.http 
      .get(BackendService.stateUrl, { 
       headers: headers 
      }) 
      .map(res => { 
       return res.json() as StateApp 
      }) 
      .catch(this.handleErrors); 
} 

Et je voudrais à ce service espace abonné et envoyer une demande au serveur. Dans mon élément dans mon élément, j'ai le code suivant:

IntervalObservable.create(1000).subscribe(() => { 
      this.statusService.getStatus() 
       .subscribe(
       (next) => { 
        this.state = next; 
       }; 
     }); 

J'ai essayé de mettre en œuvre la solution que je lis ici et qui traite de la même question (mais il est un poste d'il y a presque 2 ans) Angular2 http at an interval mais pour par exemple quand j'écris IntervalObservable.takeWhile il n'existe plus (rxjs version 5.4.3). Je me demandais donc comment obtenir le même résultat (c'est-à-dire ne pas attendre une seconde pour obtenir le résultat et cesser d'envoyer des requêtes lorsque le composant est détruit)

Answer 1

Vous pouvez utiliser rxjs interval operator et implémenter l'interrogation. Le implemention suivant exécutera la ligne this.statusService.getStatus() dans chaque intervalle de 1000 ms:

this.subscription = Observable.interval(1000).startWith(1) 
.mergeMap(() => this.statusService.getStatus()) 
.subscribe((next) => { 
    this.state = next; 
}) 

Mise à jour: avec startWith(1) ajouté, maintenant, il sera exécuté immédiatement sans délai et après qu'il sera exécuté à chaque intervalle de 1 sec . Je pense que c'est ce que vous voulez.

Ou Une autre approche: vous pouvez utiliser timer operator et procédez comme suit:

this.subscription = Observable.timer(0, 1000) 
    .mergeMapTo(this.statusService.getStatus()) 
    .subscribe((next) => { 
     this.state = next; 
    }, (errRes)=>{ 
     console.log(errRes); 
    }); 

Dans cette approche, l'opérateur de la minuterie exécutera instantanément et après qu'il exécutera en 1000 ms.

Et désinscrivez-vous du hook de cycle de vie des composants observables ngOnDestroy.

ngOnDestroy(){ 
    this.subscription.unsubscribe(); 
    } 

Aussi, ne pas oublier d'importer:

import {Observable} from 'rxjs/Observable'; 
    import 'rxjs/add/operator/mergeMap'; 
    import 'rxjs/add/operator/startWith'; 
    import 'rxjs/add/operator/mergeMapTo'; 
    import 'rxjs/add/observable/timer';