Angular2：创建并销毁计时器

发布时间：2020-12-17 10:34:18 所属栏目：安全来源：网络整理

导读：我正在尝试创建计时器,它将每5秒发送一次GET请求,我设法做到了,但我注意到如果我移动到不同的页面(路由)计时器仍在运行,所以我尝试添加ngOnDestroy,但我不知道没有“取消订阅”的方法 import {Component,OnInit,OnDestroy} from '@angular/core';import {Obs

我正在尝试创建计时器,它将每5秒发送一次GET请求,我设法做到了,但我注意到如果我移动到不同的页面(路由)计时器仍在运行,所以我尝试添加ngOnDestroy,但我不知道没有“取消订阅”的方法

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

@Component({
  templateUrl: 'app/pages/CurrentRuns/currentruns.component.html'
})




export class CurrentRunsComponent implements OnInit,OnDestroy {
  private timer;
   ticks=0;
    

  ngOnInit() {
    this.timer = Observable.timer(2000,5000);
    this.timer.subscribe(t => this.tickerFunc(t));
  }
    tickerFunc(tick){
    console.log(this);
    this.ticks = tick
  }

   ngOnDestroy(){
    console.log("Destroy timer");

  }
}

我正在使用angular2 RC7,“rxjs”：“5.0.0-beta.12”

订阅observable会返回订阅对象

import {Component,OnDestroy} from '@angular/core';
import { Observable,Subscription } from 'rxjs/Rx';

@Component({
    templateUrl: 'app/pages/CurrentRuns/currentruns.component.html'
})
export class CurrentRunsComponent implements OnInit,OnDestroy {
    ticks = 0;
    private timer;
    // Subscription object
    private sub: Subscription;

    ngOnInit() {
        this.timer = Observable.timer(2000,5000);
        // subscribing to a observable returns a subscription object
        this.sub = this.timer.subscribe(t => this.tickerFunc(t));
    }
    tickerFunc(tick){
        console.log(this);
        this.ticks = tick
    }

    ngOnDestroy(){
        console.log("Destroy timer");
        // unsubscribe here
        this.sub.unsubscribe();

    }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!