取消订阅不适用于具有多个订阅的RXJS计时器

时间:2019-03-07 10:10:33

标签: angular rxjs

我有我的Angular 7代码。我想在特定时间接连显示gif图像。

image1:运行时间为0秒到5000秒

image2:将在5000秒到接下来的3000秒之间运行 在image2计时器finsh之后;我将取消订阅。

JSON看起来像:

{
'animations': [{'gifUrl':'abc.gif'}, {'gifUrl':'xyz.gif'}]
}

订阅变量声明为

animationSubscription: Subscription[] =   [];

我已经使用for循环遍历JSON数组,然后使用RXJS计时器来订阅每个图像计时器。

for (let i = 0; i < animations.length; i++) {
  this.playAnmiation(animations[i],i);
}

动画播放逻辑是

playAnmiation(animation,i){
  this.animationSubscription[i]= timer(0 , 5000).pipe(takeUntil(this.unsubscribe))..subscribe(
  (value: number) => {
    this.imageUrl=animation.gifUrl;
    this.animationSubscription[i].unsubscribe();
  })
}

它可以正常运行,但是上一个订阅保持运行。 有什么办法可以在计时器上显示图像吗?

0 个答案:

没有答案