Javascript rxjs 6倒计时计时器6
我尝试使用rxjs 6在angular 6中实现一个倒计时计时器。我还需要能够订阅结果并重置计时器: 我尝试的是:Javascript rxjs 6倒计时计时器6,javascript,angular,rxjs,countdowntimer,Javascript,Angular,Rxjs,Countdowntimer,我尝试使用rxjs 6在angular 6中实现一个倒计时计时器。我还需要能够订阅结果并重置计时器: 我尝试的是: var timer = interval(1000).pipe( take(4) ); timer.subscribe(x => console.log(x)); 结果: 0 1 2 3 我需要的是把计时器倒过来,从3数到1 我发现这个coundown函数可以实现反向计数,但我不能订阅它,就像第一个示例中那样 interval(1000).pipe( map((x)
var timer = interval(1000).pipe(
take(4)
);
timer.subscribe(x => console.log(x));
结果:
0
1
2
3
我需要的是把计时器倒过来,从3数到1
我发现这个coundown函数可以实现反向计数,但我不能订阅它,就像第一个示例中那样
interval(1000).pipe(
map((x) => { console.log( x) })
);
结果:
0
1
2
3
empty您可以使用timer而不是interval,要真正实现倒计时,您应该像这样映射计时器结果:mapi=>countdownStart-i 日志: 3. 2. 1. 0 另一种可能的解决方案是使用范围操作符
Rx.Observable
.range(0, countdownStart + 1)
.map(i => countdownStart - i)
.subscribe(i => console.log(i));
日志:
3.
2.
1.
0您可以使用计时器而不是间隔,要真正实现倒计时,您应该像这样映射计时器结果:mapi=>countdownStart-i 日志: 3. 2. 1. 0 另一种可能的解决方案是使用范围操作符
Rx.Observable
.range(0, countdownStart + 1)
.map(i => countdownStart - i)
.subscribe(i => console.log(i));
日志:
3.
2.
1.
0以下是我如何使用TimerObservable执行此操作。记得取消订阅
import {TimerObservable} from "rxjs/observable/TimerObservable";
import { Subscription } from 'rxjs';
export class MyComponent implements OnInit, OnDestroy {
private sub: Subscription;
ngOnInit() {
// Delay 0 seconds, run every second
let timer = TimerObservable.create(0, 1000);
let number = 3;
this.sub = timer.subscribe(t => {
if(number !== 0) {
console.log(number);
number--;
}
});
}
ngOnDestroy(): void {
this.sub.unsubscribe();
}
}
下面是我如何使用TimerObservable来完成它的。记得取消订阅
import {TimerObservable} from "rxjs/observable/TimerObservable";
import { Subscription } from 'rxjs';
export class MyComponent implements OnInit, OnDestroy {
private sub: Subscription;
ngOnInit() {
// Delay 0 seconds, run every second
let timer = TimerObservable.create(0, 1000);
let number = 3;
this.sub = timer.subscribe(t => {
if(number !== 0) {
console.log(number);
number--;
}
});
}
ngOnDestroy(): void {
this.sub.unsubscribe();
}
}
怎么样
var timer = interval(1000).pipe(
take(4),
map(x => 3 - x)
);
timer.subscribe(console.log);
怎么样
var timer = interval(1000).pipe(
take(4),
map(x => 3 - x)
);
timer.subscribe(console.log);
感谢您的回答,但我仍然很难在rxJs 6中实现这一点,这个sintax我得到了错误感谢您的回答,但我仍然很难在rxJs 6中实现这一点,这个sintax我得到了错误