Given the following code, how to I alter it to make the get request to "api/foobar" repeat every 500 milliseconds?
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));
}
}
Make sure you have imported {Observable}
from rxjs/Rx
. If we don't import it we get observable not found error sometimes.
Working plnkr 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();
}
}