Как установить целостность по угловому запросу 2 Http Observable

Question

Я сделал услугу «Угловая 2», которая успешно получает данные с моего сервера. Он имеет одну функцию: getSinglePowerBlock. Цель этой функции - установить наблюдаемое, чтобы сделать запрос get данному URL-адресу и вернуть один из элементов powerblock из свойства JSON assets.powerblock[]. Я знаю, что это работает успешно, потому что я могу заставить его работать в одном из моих компонентов. Я включил этот компонент для справки.

Моя цель: Я хочу, чтобы мой код, чтобы сделать вызов get непрерывно, один раз в секунду, используя функцию interval из rxjs библиотеки. Затем я хочу, чтобы мои локальные данные обновлялись с данными каждого ответа опроса. В принципе, опрос.

Я предполагаю, что это не сложно, но я новичок в 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", 
      } 
     ] 
    } 
} 

Answer 1

Я не думаю, что так его разумно называть интервал по возвращенному обещанию/наблюдаемому, но если вы просто возвращаетесь данные (не наблюдаемые/обещающие), вы можете сделать это внутри таймера в угловом2. Он будет постоянно вызывать функцию после 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(); 
}