如何在Angular 2 Http Observable请求上设置Inteval

我做了一个Angular 2服务，它成功地从我的服务器获取数据。它有一个名为

getSinglePowerBlock

的函数。此函数的目标是设置一个可观察对象，使

get

请求到达给定的URL，并从JSON属性

assets.powerblock[]

返回一个

powerblock

元素。我知道这是成功的，因为我可以让它在我的一个组件中工作。我已将该部分包括在内，以供参考

我的目标： 我希望我的代码使用

rxjs

库中的

interval

函数，每秒连续调用一次

get

。然后，我希望我的本地数据用每个轮询响应的数据更新。基本上是一个轮询解决方案

我想这并不难做到，但我对Observables和Rxjs还不熟悉，我似乎无法正确理解语法。请随意提供一种更好的方法来执行

getPowerBlock

函数或我调用它的方式。我相信你在这方面比我聪明得多

我只希望当此组件是用户正在查看的当前页面时打开轮询。

服务：

import { Injectable }     from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable }     from 'rxjs';
import 'rxjs/Rx';

import { PowerBlock } from './classes/power-block';

@Injectable()
export class ServerCommsService {

  private pbIndex: number = 0;

  constructor (private http: Http) {}

  getPowerBlock(): Observable<PowerBlock> {
    return this.http
      .get('/database-calls/getdata?type=powerblock')
      .map((r: Response) => r.json().assets.powerblock[this.pbIndex] as PowerBlock);
  }
}

import { Component, OnInit } from '@angular/core';
import { Observable }        from 'rxjs/Observable';

import { PowerBlock } from '../classes/power-block';
import { ServerCommsService } from '../server-comms.service';

@Component({
  moduleId: module.id,
  selector: 'power-block',
  templateUrl: 'power-block.component.html'
})
export class PowerBlockComponent implements OnInit {
  public title: string = 'PowerBlock';
  private powerBlock: PowerBlock;

  constructor(
    private server: ServerCommsService
  ) {}

  ngOnInit(): void {
    this.server.getPowerBlock().subscribe(
      pb => this.powerBlock = pb,
      err => {console.log(err)}
    );
  }
}

从服务器返回的

JSON

：

{
    "assets": {
        "powerblock": [
            {
                "id": "001",
                "name": "PB1",
            },
            {
                "id": "002",
                "name": "PB2",
            }
        ]
    }
}

---

我不认为对返回的承诺/可观测值调用间隔是明智的，但是如果您只是返回数据（不可观测/可观测值），您可以在angular2的计时器内执行此操作。它将在1秒后连续调用该函数

import {OnInit, OnDestroy} from '@angular/core';

在组件中创建订阅持有者变量

private timerSubscription: any;   //just to hold the reference

您可以在OnInit事件中初始化计时器，并在变量中获取订阅，以便稍后在OnDestroy中取消订阅

ngOnInit()
{
    //start a timer after one second
    let timer = Observable.timer(1000, 1000);
    this.timerSubscription = timer.subscribe((t:any) => {
        //call your getPowerBlock function here 
    });
}

最后，只需销毁订阅，因为它不再需要

ngOnDestroy()
{
    if(this.timerSubscription)
        this.timerSubscription.unsubscribe();
}

---

谢谢你的快速回复。用可观察的还是承诺来做这类事情更好？我不这么认为，用可观察的来做是明智的，但如果你只是返回数据（不可观察/承诺），你可以这样做。它将在1秒后持续池化如果我只想在组件为当前页面时打开计时器怎么办？组件中的计时器将仅在加载到任何页面时执行，您只需确保在Ngondestroy中销毁它可能的副本