使用angular和rxjs實現輪詢

Question

我想用角度應用程序在我的nativescript中實現輪詢。 我想每秒檢查一下后端服務器的狀態。 我有這項服務：

@Injectable()
export class StateService {
getStatus(): Observable<StateApp> {
        let headers = this.getHeaders();
        return this.http
            .get(BackendService.stateUrl, {
                headers: headers
            })
            .map(res => {
                return res.json() as StateApp
            })
            .catch(this.handleErrors);
}

然后我想掛起這個服務並向服務器發送請求。 在我組件的組件中，我有以下代碼：

IntervalObservable.create(1000).subscribe(() => {
            this.statusService.getStatus()
                .subscribe(
                (next) => {
                    this.state = next;
                };
        });

我試圖實現我在這里閱讀的解決方案，它處理相同的問題（但它是差不多2年前的帖子） Angular2 http的間隔，但是例如當我寫IntervalObservable.takeWhile它不再存在時（rxjs）版本5.4.3）。 所以我想知道實現相同結果的方式是什么（即第一次不等待一秒鍾來獲取結果並在組件被銷毀時停止發送請求）

Answer 1

您可以使用rxjs interval運算符並實現輪詢。 以下實現將每1000毫秒間隔執行this.statusService.getStatus()行：

 this.subscription = Observable.interval(1000).startWith(1)
 .mergeMap(() => this.statusService.getStatus())
 .subscribe((next) => {
     this.state = next;
 })

更新：添加startWith(1) ，現在，它將立即執行，沒有任何延遲，之后每隔1秒執行一次。 我想這就是你想要的。

或另一種方法：您可以使用計時器操作符並執行以下操作：

this.subscription = Observable.timer(0, 1000)
  .mergeMapTo(this.statusService.getStatus())
  .subscribe((next) => {
        this.state = next;
    }, (errRes)=>{
       console.log(errRes);
   });

在這種方法中，計時器操作員將立即執行，之后將每1000毫秒執行一次。

並取消訂閱Observable組件ngOnDestroy生命周期鈎子。

  ngOnDestroy(){
     this.subscription.unsubscribe();
  }

另外別忘了導入：

  import {Observable} from 'rxjs/Observable';
  import 'rxjs/add/operator/mergeMap';
  import 'rxjs/add/operator/startWith';
  import 'rxjs/add/operator/mergeMapTo';
  import 'rxjs/add/observable/timer';