Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了如何使用Angular 2 Observable进行轮询大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
鉴于以下代码,如何更改它以使得“api / foobar”的get请求每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));
    }
}
确保你从’rxjs / Rx’导入导入{ObservablE}如果我们不导入它我们得到可观察到的错误有时会发现错误

工作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();
}
}

大佬总结

以上是大佬教程为你收集整理的如何使用Angular 2 Observable进行轮询全部内容,希望文章能够帮你解决如何使用Angular 2 Observable进行轮询所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。