以设定的间隔轮询Angular Observable<number>

import { Component, OnInit } from '@angular/core';
import { interval, Observable } from 'rxjs';
import { switchMap, takeWhile } from 'rxjs/operators';

@Component({
  selector: 'app-polling-example',
  template: `<div>{{ data }}</div>`
})
export class PollingExampleComponent implements OnInit {
  data: number;
  private isPolling = false;

  ngOnInit() {
    this.startPolling();
  }

  startPolling() {
    this.isPolling = true;
    interval(5000) // 每5秒轮询一次
      .pipe(
        switchMap(() => this.fetchData()), // 调用获取数据的函数
        takeWhile(() => this.isPolling) // 当isPolling为false时停止轮询
      )
      .subscribe(data => {
        this.data = data;
      });
  }

  stopPolling() {
    this.isPolling = false;
  }

  fetchData(): Observable<number> {
    // 模拟从服务器获取数据
    return new Observable(observer => {
      setTimeout(() => {
        observer.next(Math.random());
        observer.complete();
      }, 1000);
    });
  }
}