我需要在Angular 2中使用一个计时器,该计时器会在一个时间间隔后滴答作响,并执行某些任务(可能会调用某些函数)。
如何使用Angular 2做到这一点?
最佳答案
除了上述所有答案外,我还将使用RxJS Observables进行此操作
请检查Observable.timer
这是一个示例代码,将在2秒后开始,然后每秒滴答一次:
import {Component} from 'angular2/core';
import {Observable} from 'rxjs/Rx';
@Component({
selector: 'my-app',
template: 'Ticks (every second) : {{ticks}}'
})
export class AppComponent {
ticks =0;
ngOnInit(){
let timer = Observable.timer(2000,1000);
timer.subscribe(t=>this.ticks = t);
}
}
这是一个有效的plunker
更新
如果要调用在AppComponent类上声明的函数,则可以执行以下任一操作:
**假设您要调用的函数名为 func ,
ngOnInit(){
let timer = Observable.timer(2000,1000);
timer.subscribe(this.func);
}
上面方法的问题是,如果在func内部调用“this”,它将引用订户对象而不是AppComponent对象,而这可能不是您想要的。
但是,在下面的方法中,您将创建一个lambda表达式,并在其中调用函数 func 。这样,对func的调用仍然在AppComponent的范围之内。我认为这是最好的方法。
ngOnInit(){
let timer = Observable.timer(2000,1000);
timer.subscribe(t=> {
this.func(t);
});
}
检查this plunker的工作代码。