角度:取消订阅Timer后注入另一个功能Observable

问题描述:

我正在创建一个考试应用程序,因此当时间到了时,我需要一个视图控制器来弹出以告诉用户他已超出他的时间并将他/她带到结果页面! !角度:取消订阅Timer后注入另一个功能Observable

但取消订阅计时器后,我的函数进入循环!

请帮我看看这个..

我的代码在下面!

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(); 
} 
+0

你可以设置一个plunker,请你怎么看的循环?警报显示所有的时间? – Vega

+0

是的,在这里一个蹲点会很有帮助。否则,我们只是在猜测语法。 – DeborahK

我没有尝试这个...但你可以尝试以下操作:?

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 
      } 
     } 
    ); 
} 
+0

我在想同样的:) – Vega

+0

@DeborahK仍然返回相同的循环 –

+0

你真的需要为我们提供一个蹲点,以更好地检查这是如何工作的。转到此网站:https://plnkr.co/edit/?p = catalogue从大绿色的新建按钮下拉列表并选择“角度”。然后将您的代码添加到生成的文件。如果您可以在那里证明问题......我们可以使用代码来解决它。 – DeborahK

Observable.timer(1, 1000) 
    .map(t=>this.getMinutes(t) === 1) // Observable<tick> -> Observable<boolean> 
    .first(istimeUp => istimeUp) // take first Observable<true> 
    .subscribe(()=>this.showAlert())