ANGULAR:取消订阅 Timer Observable 后注入另一个函数
Posted
技术标签:
【中文标题】ANGULAR:取消订阅 Timer Observable 后注入另一个函数【英文标题】:ANGULAR: Inject Another Function after unsubscribing from Timer Observable 【发布时间】:2018-02-09 21:26:07 【问题描述】:我正在创建一个考试应用程序,所以当时间到时,我需要一个视图控制器弹出来告诉用户他已经超出了他/她的时间并将他/她带到结果页面!
但是退订定时器后,我的函数进入了循环!!!
拜托,我需要这方面的帮助..
下面是我的代码!
minutesDisplay: number = 0;
hoursDisplay: number = 0;
secondsDisplay: number = 0;
sub: Subscription;
showAlert()
let alert = this.alertCtrl.create(
subTitle: 'Ooops, Time Up! ',
);
alert.present();
this.activity.openModal();
ngOnInit()
this.startTimer();
public ngOnDestroy()
if (this.minutesDisplay == 1)
this.sub.unsubscribe();
return true;
private startTimer()
let timer = Observable.timer(1, 1000);
this.sub = timer.subscribe(
t =>
this.ticks = t;
this.secondsDisplay = this.getSeconds(this.ticks);
this.minutesDisplay = this.getMinutes(this.ticks);
this.hoursDisplay = this.getHours(this.ticks);
this.ngOnDestroy();
);
this.showAlert();
【问题讨论】:
你能设置一个plunker吗?你怎么看循环?提示一直显示? 是的,plunker 在这里会很有帮助。否则我们只是在猜测语法。 【参考方案1】:我没有尝试这个...但您可以尝试以下方法:
public ngOnDestroy()
this.sub.unsubscribe(); // Stop the timer if the user navigates elsewhere
private startTimer()
let timer = Observable.timer(1, 1000);
this.sub = timer.subscribe(
t =>
this.ticks = t;
this.secondsDisplay = this.getSeconds(this.ticks);
this.minutesDisplay = this.getMinutes(this.ticks);
this.hoursDisplay = this.getHours(this.ticks);
if (this.minutesDisplay == 1)
this.sub.unsubscribe(); // Stop the timer when time is up.
this.showAlert(); // Show the alert now
);
【讨论】:
我也是这么想的:) @DeborahK 仍然返回相同的循环 您确实需要为我们提供一个 plunker 以更好地检查它是如何工作的。转到此站点:plnkr.co/edit/?p=catalogue 从绿色的大 New 按钮下拉列表并选择“Angular”。然后将您的代码添加到生成的文件中。如果您可以在那里证明问题......我们可以使用代码来解决它。 还有……this.minutesDisplay
会是 1 吗?你的getMinutes
方法是做什么的?
plnkr.co/edit/qk2c9nr6dBn2jWeaVf8d?这就是代码的链接,你可以看到我的 getMINutes 函数做了什么!!!【参考方案2】:
Observable.timer(1, 1000)
.map(t=>this.getMinutes(t) === 1) // Observable<tick> -> Observable<boolean>
.first(istimeUp => istimeUp) // take first Observable<true>
.subscribe(()=>this.showAlert())
【讨论】:
以上是关于ANGULAR:取消订阅 Timer Observable 后注入另一个函数的主要内容,如果未能解决你的问题,请参考以下文章
Angular 2 - 订阅 FormControl 的 valueChanges 是不是需要取消订阅?