web-dev-qa-db-fra.com

Je n'ai pas rxjs 6 avec angular 6 avec intervalle, switchMap et map

Je veux mettre à jour mon code rxjs à 6 Je ne l’ai pas.

Avant j'avais le dessous qui wouth scruter pour de nouvelles données toutes les 5 secondes:

import { Observable, interval } from 'rxjs';
import { switchMap, map } from 'rxjs/operators';

var result = interval(5000).switchMap(() => this._authHttp.get(url)).map(res => res.json().results);

Maintenant ... bien sûr, il est cassé et la documentation ne me laisse nulle part où aller.

Comment puis-je écrire ce qui précède pour se conformer à rxjs 6?

Merci

angularrxjsrxjs6
19
Tampa

Le code devrait être quelque chose comme ce qui suit. Vous devez utiliser l'opérateur pipe.

import { interval } from 'rxjs';
import { switchMap, map } from 'rxjs/operators';

const result = interval(5000).pipe(
switchMap(() => this._authHttp.get(url)),    
map(res => res.results)
)
34
siva636

Après de nombreuses recherches, je pouvais proposer l'approche mise à jour suivante à partir de RxJs '6 avec Angular 6.

L'API de recherche est appelée après chaque intervalle de 5 secondes et désabonnée une fois que le compte> 5:

let inter=interval(5000)

let model : ModelComponent;
model=new ModelComponent();
model.emailAddress="[email protected]";


let count=1;
this.subscriber=inter.pipe(
          startWith(0),
          switchMap(()=>this.asyncService.makeRequest('search',model))
        ).subscribe(response => {
          console.log("polling")
          console.log(response.list)
          count+=1;
          if(count > 5){
            this.subscriber.unsubscribe();
          }
        });

Demande d'API:

   makeRequest(method, body) : Observable<any> {
    const url = this.baseurl + "/" + method;

    const headers = new Headers();
    this.token="Bearer"+" "+localStorage.getItem('token'); 
    headers.append('Authorization', this.token);
    headers.append('Content-Type','application/json');

    const options = new RequestOptions({headers: headers});
    return this.http.post(url, body, options).pipe(
        map((response : Response) => {
            var json = response.json();                

           return json; 
        })
    );
}

N'oubliez pas de vous désabonner pour éviter les fuites de mémoire.

ngOnDestroy(): void {
if(this.subscriber){
  this.subscriber.unsubscribe();
}

}

4
Shahbaaz Khan