如何使用 RXJS Observables 轮询服务?
How do I poll a service using RXJS Observables?
给定以下代码,我如何更改它以使获取请求 "api/foobar" 每 500 毫秒重复一次?
import {Observable} from "RxJS/Rx";
import {Injectable} from "@angular/core";
import {Http} from "@angular/http";
@Injectable() export class ExampleService {
constructor(private http: Http) { }
getFooBars(onNext: (fooBars: FooBar[]) => void) {
this.get("api/foobar")
.map(response => <FooBar[]>reponse.json())
.subscribe(onNext,
error =>
console.log("An error occurred when requesting api/foobar.", error));
}
}
为什么不试试 setInterval(
)?
setInterval(getFooBars(), 500);
试试这个
return Observable.interval(2000)
.switchMap(() => this.http.get(url).map(res:Response => res.json()));
确保您已从 rxjs/Rx
导入 {Observable}
。如果我们不导入它,有时会出现可观察到的未找到错误。
工作计划http://plnkr.co/edit/vMvnQW?p=preview
import {Component} from '@angular/core';
import {Http} from '@angular/http';
import 'rxjs/Rx';
import {Observable} from 'rxjs/Rx';
@Component({
selector: 'app',
template: `
<b>Angular 2 HTTP polling every 5 sec RxJs Observables!</b>
<ul>
<li *ngFor="let doctor of doctors">{{doctor.name}}</li>
</ul>
`
})
export class MyApp {
private doctors = [];
pollingData: any;
constructor(http: Http) {
this.pollingData = Observable.interval(5000)
.switchMap(() => http.get('http://jsonplaceholder.typicode.com/users/')).map((data) => data.json())
.subscribe((data) => {
this.doctors=data;
console.log(data);// see console you get output every 5 sec
});
}
ngOnDestroy() {
this.pollingData.unsubscribe();
}
}
给定以下代码,我如何更改它以使获取请求 "api/foobar" 每 500 毫秒重复一次?
import {Observable} from "RxJS/Rx";
import {Injectable} from "@angular/core";
import {Http} from "@angular/http";
@Injectable() export class ExampleService {
constructor(private http: Http) { }
getFooBars(onNext: (fooBars: FooBar[]) => void) {
this.get("api/foobar")
.map(response => <FooBar[]>reponse.json())
.subscribe(onNext,
error =>
console.log("An error occurred when requesting api/foobar.", error));
}
}
为什么不试试 setInterval(
)?
setInterval(getFooBars(), 500);
试试这个
return Observable.interval(2000)
.switchMap(() => this.http.get(url).map(res:Response => res.json()));
确保您已从 rxjs/Rx
导入 {Observable}
。如果我们不导入它,有时会出现可观察到的未找到错误。
工作计划http://plnkr.co/edit/vMvnQW?p=preview
import {Component} from '@angular/core';
import {Http} from '@angular/http';
import 'rxjs/Rx';
import {Observable} from 'rxjs/Rx';
@Component({
selector: 'app',
template: `
<b>Angular 2 HTTP polling every 5 sec RxJs Observables!</b>
<ul>
<li *ngFor="let doctor of doctors">{{doctor.name}}</li>
</ul>
`
})
export class MyApp {
private doctors = [];
pollingData: any;
constructor(http: Http) {
this.pollingData = Observable.interval(5000)
.switchMap(() => http.get('http://jsonplaceholder.typicode.com/users/')).map((data) => data.json())
.subscribe((data) => {
this.doctors=data;
console.log(data);// see console you get output every 5 sec
});
}
ngOnDestroy() {
this.pollingData.unsubscribe();
}
}